3

JointJS/Rappid ダイアグラム ライブラリを使用して、有向グラフのノードのサブセットのみをレイアウトする方法を探しています。

グラフ内にいくつかの「固定」ノードが必要であり、「その他」をレイアウトします。それらは相互に、またはいくつかの固定ノードと接続できると仮定します（グラフはすでに紙に追加されています）。

APIはグラフオブジェクトで使用する必要があるためjoint.layout.DirectedGraph.layout、レイアウト計算中にグラフの一部のノードを「固定」するメカニズムがあるかどうか疑問に思っていました（たとえば、セルオブジェクトに追加するプロパティ）。また、このようなものでも問題ありませんが、getSubgraph API で受信リンクと送信リンクを取得しないでください。

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

ドキュメントを見ると、この種の機能を特定できませんでした。この機能がサポートされていない場合、目標を達成するために使用できる他のアプローチはありますか? (もちろん、グラフ全体をレイアウトし、操作が終了したときに固定コードを適用することもできますが、これよりも優れたものを探していました)。

4

1 に答える 1

3

したがって、Dagre を使用した自動レイアウト機能は、Rappid バージョンのジョイント js (つまり有料) でのみ利用できるようになったと確信しています。私がしていることは、Dagre を個別に使用してレイアウト計算を実行し、要素を繰り返し処理し、Dagre 出力を使用してそれらの位置を手動で変更することです。理想的ではありませんが、ノードのサブセットのみを見るという点で、やりたいことが何でもできます。以下の基本的なコード (graphObj は jointjs グラフ オブジェクトです)。要素とリンクのサブセットを操作する場合は、これを出発点として使用できるはずです。

    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;

    });
于 2016-06-22T10:10:28.747 に答える