2016-06-20 16 views
2

Ich suche nach einer Möglichkeit, nur eine Teilmenge von Knoten eines gerichteten Graphen mit JointJS/Rappid Diagrammerstellung Bibliothek.Layout DirectedGraph (dagre) nur auf einer Teilmenge von Knoten

Ich brauche einige "feste" Knoten in der Grafik und layout die "anderen", unter der Annahme, dass sie miteinander oder mit einigen der festen Knoten verbunden werden können (die Grafik ist bereits in die Zeitung aufgenommen). Da die API joint.layout.DirectedGraph.layout auf einem Graphenobjekt verwendet werden muss, habe ich mich gefragt, ob es einen Mechanismus gibt, bei dem einige Knoten des Graphen während der Layoutberechnung "fixiert" werden können (z. B. etwas hinzuzufügen)). auch so etwas wie dieses kann in Ordnung sein, aber keine eingehende und ausgehende Links sollten durch die getSubgraph API

var subGraph = graph.getSubgraph([A, B]); 
joint.layout.DirectedGraph.layout(subGraph, layoutOpt); 

Mit Blick auf die Dokumente abgerufen werden ich nicht in der Lage war, diese Art von Funktion zu identifizieren. Wenn diese Funktion nicht unterstützt wird, gibt es einen anderen Ansatz, mit dem ich mein Ziel erreichen könnte? (Natürlich kann ich auch den gesamten Graphen entwerfen und meine fixen Akkorde anwenden, wenn die Operation endet, aber ich suchte nach etwas Besserem als diesem).

Antwort

2

So bin ich mir ziemlich sicher, dass die Auto-Layout-Funktionalität mit Dagre jetzt nur in der Rappid-Version von Joint js (d. H. Bezahlt) verfügbar ist. Ich benutze Dagre separat, um die Layout-Berechnungen durchzuführen und dann durch die Elemente zu iterieren und die Dagre-Ausgabe zu verwenden, um ihre Position manuell zu ändern. Nicht ideal, aber es erlaubt Ihnen, alles zu tun, was Sie wollen, indem Sie nur eine Teilmenge von Knoten betrachten. Basic-Code unten (graphObj ist das jointjs Diagrammobjekt), sollten Sie in der Lage sein, dies als Ausgangspunkt zu verwenden, wenn Sie mit einer Teilmenge von Elementen und Verbindungen arbeiten wollen:

var nodes = []; 
    var edges = []; 

    var elements = graphObj.getElements(); 
    elements.forEach(function(element){ 
     element.label = element.id; 
     element.width = element.attributes.size.width; 
     element.height = element.attributes.size.height; 
    }); 
    var links = graphObj.getLinks(); 
    links.forEach(function(link){ 
     edges.push({source: link.getSourceElement(), target: link.getTargetElement()}); 
    }); 
    dagre.layout() 
     .nodeSep(150) 
     .edgeSep(100) 
     .rankSep(150) 
     .rankDir("LR") 
     .nodes(elements) 
     .edges(edges) 
     .run(); 

    elements.forEach(function(element){ 
     element.position(element.dagre.x, element.dagre.y); 
     element.attributes.prop.metadata.x = element.dagre.x; 
     element.attributes.prop.metadata.y = element.dagre.y; 

    }); 
+0

soll ich hinzufügen, dass die letzten beiden Zeilen sind nicht notwendig (Festlegen eines Metadatenobjekts für die Eigenschaften des Elements) - Ich verwalte zusätzliche Metadaten für die Elementobjekte für andere Zwecke. –