Wie finde ich heraus, ob das Force-Layout die Knoten platziert hat?

Question

Ich habe Grafik basierend auf Force-Layout. Ich würde gerne ein 'Laden' Overlay setzen, bis der Graph fertig ist und die Knoten platziert. Mit welchem ​​Ereignis/welcher Eigenschaft kann ich herausfinden, dass ein Diagramm erstellt wurde?

ich die API überprüft, konnte nichts finden ..

Answer 1

Wenn das Layout konvergiert, force.alpha() wird auf 0 einen Timer für das (nicht zu oft abfragen Stellen eingestellt werden!) und du wirst wissen, wenn du fertig bist.

Dieses Beispiel sollte alle interval Millisekunden wiederholen, bis das Layout stoppt. Die Variable timer behält den aktuellen Timer bei, den Sie zurücksetzen können, wenn Sie nicht warten möchten, bis das Layout abgeschlossen ist.

var timer = null; 
function onCompletion(force, callback, interval) { 
    interval = interval || 300; 

    function retryIfRunning() { 
     if (force.alpha() != 0) 
      timer = setTimeout(checkAndRetry, interval); 
     else { 
      timer = null; 
      callback(); 
     } 
    } 

    retryIfRunning(); 
} 

Answer 2

Es ist nicht möglich, wie eine eingebaute Funktion, wie es hängt davon ab, was man bedenkt, wie bei der Platzierung Knoten getan. Die Art, wie es gemacht wird, ist, indem Sie die tick Funktion n mal, mit n abhängig von der Größe des Diagramms, das Sie haben, und der Präzision, die Sie wollen, aufrufen.

# force.tick(): Führt die Force-Layout-Simulation in einem Schritt aus.

Ich möchte Sie ermutigen die force.tick() Dokumentation zu lesen, wenn Sie mehr wissen wollen: https://github.com/mbostock/d3/wiki/Force-Layout#wiki-tick

Answer 3

Von the documentation, das end Ereignis ausgelöst wird, wenn das Layout fertig ist, das heißt, wenn force.alpha === 0.

So können Sie herausfinden, wenn es mit getan wird:

force 
    .nodes(yourNodes) 
    .links(yourLinks) 
    .on('tick', function() { 
    // layout is in progress 
    }) 
    .on('end', function() { 
    // layout is done 
    callback(); 
    });