d3: Stellen Sie eine statische gerichteten Graphen

Möchte ich visualisieren 20K Knoten dependency graph in d3. Kraft-gerichtete Graphen wie http://bl.ocks.org/mbostock/1153292 sind zu langsam, um das Rendern im browser für diese Anzahl von Knoten.

Grundsätzlich möchte ich repräsentieren Knoten mit text und gerichtete Kanten von einem Knoten zu einem anderen, und fügen zooming-und panning-Funktionen. Wie kann ich über das tun dies in d3?

d3: Stellen Sie eine statische gerichteten Graphen

InformationsquelleAutor alste | 2013-10-15
  1. 6

    Dem zoom-Verhalten (und pan) würden Sie grundsätzlich kostenlos durch die zoom-Verhalten. Das layout, das Sie würden tun müssen, selbst wenn-das force-layout ist so ziemlich das einzige was in D3 können Sie verwenden, um das Layout eines Graphen dieser Art.

    Unabhängig davon, was Sie verwenden, mit 20K Knoten etwas dynamischer sein wird ziemlich langsam-einfach Rendern aller Elemente wird einige Zeit dauern, während der der browser scheint nicht mehr reagiert. Eine alternative, die Sie betrachten wünschen können, ist die pre-Rendern der Grafik mit etwas mehr geeignet für große Mengen von Daten, speichern Sie das Ergebnis als Bild (oder auch statische SVG) und fügen Sie ein wenig von D3 code oben für zoom/pan.

    • Danke. Wie generieren Sie eine statische gerichteter graph mit d3, ähnlich wie der oben abgebildete, ohne Anwendung von Gewalt-layout?
    • Sie müssen berechnen Sie das layout selbst. Sobald Sie die Positionen aller Knoten, sollte es ziemlich unkompliziert zum zeichnen des Graphen.
    • Haben Sie irgendwelche Beispiele, die ich mir ansehen kann wie das geht?
    • Nicht in D3, aber möchten Sie vielleicht einen Blick auf jsviz.
    InformationsquelleAutor Lars Kotthoff
  2. 4

    Hier ist eine alternative, die nicht scheinen, Gewalt anzuwenden, um das Layout der Knoten - es gibt keine Federung, funktioniert gut, und hat errichtet in der upload - /download-Möglichkeit. Die Lizenz ist die MIT - /X:

    Interaktives Werkzeug für die Erstellung von gerichteten Graphen mit d3.js

    directed-graph-Ersteller

    Betrieb:

    • ziehen/scrollen Sie zu übersetzen/Zoomen der Graphen
    • shift-Klick auf die Grafik zum erstellen eines Knoten
    • shift-Klick auf einen Knoten und ziehen Sie dann zu einem anderen Knoten zu verbinden mit eine gerichtete Kante
    • shift-Klick auf einen Knoten ändern Ihren Titel
    • klicken Sie auf Knoten oder Kante und drücken Sie die Rücktaste/löschen zu löschen

    d3: Stellen Sie eine statische gerichteten Graphen

    InformationsquelleAutor ptim
  3. -1

    Können Sie erzeugen eine statische gerichteten Graphen ohne die animation mit Kraft.starten, zu erzwingen.tick, Kraft.stop. Hier ist ein Beispiel:

    http://vida.io/documents/fGzpzjP98Bs2ShMHW

    Be-20K-Knoten können performance-Problem mit nur statischen Graphen. Sie können sparen, chart , dann laden Sie es ohne d3-Berechnung.

    • Link erfordert sign-in "code anzeigen". -1
    InformationsquelleAutor Phuoc Do
Schreibe einen Kommentar