7

Sono stato in grado di costruire un grafico di Force Directed usando un Force layout. La maggior parte delle funzioni funziona alla grande, ma l'unico grosso problema che sto riscontrando è che, all'avvio del layout, rimbalza su tutta la pagina (dentro e fuori il contorno della tela) prima di stabilirsi nella sua posizione sulla tela.Come posso controllare la voce di rimbalzo di un grafico di Force Directed in D3?

Ho provato con alpha di controllarlo, ma non sembra funzionare:

// Create a force layout and bind Nodes and Links 
    var force = d3.layout.force() 
     .charge(-1000) 
     .nodes(nodeSet) 
     .links(linkSet) 
     .size([width/8, height/10]) 
     .linkDistance(function(d) { if (width < height) { return width*1/3; } else { return height*1/3 } }) // Controls edge length 
     .on("tick", tick) 
     .alpha(-5) // <---------------- HERE 
     .start(); 

Qualcuno sa come controllare correttamente l'ingresso di un layout di forza nella sua tela SVG?

Non mi dispiacerebbe che il grafico fluttui dentro e si assestasse lentamente ma il rimbalzo folle dell'intero grafico non è affatto allettante.

proposito, l'esempio Force Directed Graph sono disponibili all'indirizzo: http://bl.ocks.org/Guerino1/2879486enter link description here

Grazie per qualsiasi aiuto che potete offrire!

+0

Hai mai trovato una risposta a questa domanda? Sto avendo lo stesso problema. – Braden

risposta

2

Ho pensato anche a questo problema e questa è la soluzione che ho trovato. Ho usato nodejs per eseguire il layout di forza tick offline e salvare i dati dei nodi risultanti in un file json. L'ho usato come nuovo file json per il layout. Non sono sicuro che funzioni meglio ad essere onesti. Mi piacerebbe sapere di tutte le soluzioni che trovi.

5

I nodi sono inizializzati con una posizione casuale. Dalla documentazione: "Se non si inizializzano manualmente le posizioni, il layout della forza le inizializzerà casualmente, dando come risultato un comportamento alquanto imprevedibile." Si può vedere nel codice sorgente:

// initialize node position based on first neighbor 
function position(dimension, size) { 
    ... 
    return Math.random() * size; 

Saranno all'interno del confine tela, ma può essere spinto fuori dalla forza. Lei ha molte soluzioni:

  1. I nodi possono essere vincolati all'interno della tela: http://bl.ocks.org/mbostock/1129492
  2. provare più forza di carica e collegamenti più brevi, o più attrito, in modo che i nodi si tende a rimbalzare meno
  3. È possibile eseguire la simulazione, senza che anima i nodi, mostrando solo il risultato finale http://bl.ocks.org/mbostock/1667139
  4. È possibile inizializzare la posizione nodi https://github.com/mbostock/d3/wiki/Force-Layout#wiki-nodes (ma se li si posiziona al centro, la repulsione sarà enorme e il grafico esploderà ancora di più):

.

var n = nodes.length; nodes.forEach(function(d, i) { 
    d.x = d.y = width/n * i; }); 
+0

Tutte queste opzioni sembrano molto incerte e non garantiscono il funzionamento se il numero di collegamenti/relazioni cambia da un rendering all'altro. Avrò casi in cui la visualizzazione ha zero collegamenti e ci saranno altri estremi con migliaia di link (tutti fuori da un nodo centrale/focale). Qualche idea su come garantire una costante stabilizzazione del grafico per ogni estremo e tutto il resto? Grazie. –

Problemi correlati