cytoscape.js cose Layout-Knoten überlappen

Question

Ich versuche zu ermitteln, wie die richtigen Abstände erhalten, wenn Sie die cytoscape.js-Bibliothek mit dem Cose-Layout verwenden. Insbesondere, wenn ich eine Breite und Höhe eines Knotens definiere, tendieren die Knoten dazu, sich zu überlappen.

Hier ist die Demo

Ich habe versucht, mit den Layout-Optionen zu experimentieren, aber ich habe keine Optionen gefunden, die mich mit meinem beabsichtigten Ergebnis liefern. Im Idealfall könnte ich Knoten unterschiedlicher Größe haben.

Eine Randnotiz: Ein seltsames Verhalten, das ich gefunden habe, wenn ich den Graphen mit einer Kante, die die gleiche Quelle und das gleiche Ziel hat, erstellt .. der Layoutabstand ist so, wie ich es beabsichtigt hätte. (Siehe den roten Knopf auf dem PLNKR). Aber offensichtlich hilft es nicht, wenn ich diese Art von Kante nicht habe.

Answer 1

Das Hinzufügen von Kanten ändert die Dynamik des Systems. Die Grundkräfte sind Feder/Elastizität, Abstoßung und Schwerpunkt-Schwerkraft. Möglicherweise interessiert Sie auch der Knotenüberlappungsmultiplikator, der dazu beiträgt, die Kräfte zu erhöhen, wenn eine Überlappung erkannt wird. Sie müssen mit vielen Kombinationen experimentieren, um zu sehen, was mit Ihren Daten funktioniert, aber es funktioniert. Hier sind einige Beispiele, in denen die Optionen entsprechend auf die Daten abgestimmt wurden: #1#2

Es ist ein Kompromiss zwischen Entwicklerzeit und benutzerbezogener Laufzeitleistung. CoSE ist wirklich schnell, aber der Entwickler muss die Optionen genau für ihre Daten einstellen. Andere Kraft-Layouts, wie CoSE-Bilkent und Cola, sind für den Entwickler viel einfacher zu benutzen - aber sie laufen langsamer.