Come migliorare la spaziatura nel layout 'cose' in cytoscape.js?

Question

Sto usando cytoscape.js 2.3.9 e sto giocando con alcuni layout. Ora sto eseguendo il rendering di circa 150 nodi, ma desidero andare fino a 1000-1500. Ci sono circa 25 nodi con 1-50 bambini possibili. Il mio approccio migliore per ciò di cui ho bisogno è stato con il layout 'cose', ma sono abbastanza lontano dal risultato finale previsto.

Ho provato diverse configurazioni giocando con i valori degli attributi come documentato, ma non sono così tanto in vigore le simulazioni dirette e mi sento di provare senza molto senso.

Con questa configurazione:

layout: { 
    'name':'cose', 
    'animate':false, 
    'refresh':.1, 
    'edgeElasticity' : 20, 
    'fit': true, 
    'gravity' : 100  
} 

ottengo questo risultato (linea rossa mostra la dimensione del div contenitore):

Vorrei che il grafico si adatta meglio, lasciando meno spazio vuoto e del bambino nodi per essere più vicino al suo genitore. A volte con pochi elementi si adatta meglio (ma non sempre), in questo modo:

Ma anche così alcuni nodi figlio si sovrappongono suo genitore e gli altri ottenere finora.

Qualche consiglio sui valori degli attributi o su qualsiasi altro layout che si adatti meglio al mio scopo?

Grazie.

Answer 1

Come è la natura dei layout force-directed/physics-sim, è necessario adattare i valori di forza ai dati specifici. Il mio suggerimento è di copiare e incollare l'esempio nei documenti per cose; usa i valori predefiniti.

Sperimenta modificando ciascun valore in modo indipendente e vedere quali sono gli effetti ottenuti.

Sfortunatamente, non esiste un valore unico per tutti i valori di forza, ma abbiamo provato a impostare valori predefiniti che funzionano correttamente per la maggior parte dei dati che abbiamo visto.