1

これは、この質問のフォローアップです: D3 動的階層エッジ バンドリング - 双方向インポート

元の問題は解決され、http://jsfiddle.net/w2rfwokx/1/に示されて います。つまり、ノード 1 とノード 2 の両方が相互にインポートする場合にオレンジ色のリンクがあります。しかし、この解像度には問題があるようです。これは、 http://jsfiddle.net/w2rfwokx/3/に示されているこの新しいデータ セットで明らかになります。

ノード 1 とノード 2 の両方が相互にインポートされ、ノード 1 が強調表示されると、ノード 2 はオレンジ色になりますが、これは必要な状態ですが、リンクはそうではありません。

ここに画像の説明を入力

コードは複雑なデータセットを考慮していないと思います。この複雑なデータ セットでは、ノード 1 がノード 2 をインポートし、ノード 2 がノード 1 をインポートし、ノード 3 がノード 3 をインポートします。

このコード ブロック内の一意のリンク配列の構成を変更する必要があることがわかります

var unique_links = links.reduce(function(p,c) {
    var index=p.map(function(d,i) { if(d.source===c.target && d.target===c.source) return i;}).shift();
    if(!isNaN(index)) p[index].both=true; else p.push(c);
    return p;
  },[]);

私は何が変わるのかを見るのに苦労していますが。私はまだd3.jsを学んでおり、私の主な目的はこれをプロセス管理に適用することです

どんなポインタも役に立ちます

4

1 に答える 1

0

リンクが「両方向」として適切にマークされていませんでした。

このコード セグメントは正しくありません:

d.both = unique_links.filter(function(v) { if (v.source===d.source && v.target===d.target) return v.both; }).shift();

}))

次のようになります。

d.both = unique_links.filter(function (v) {
    if (v.source === d.target && v.target === d.source){
        return v.both = d.both = true;
    }
})

これはjsfiddleです。デモ画面のアニメーション:

ここに画像の説明を入力

于 2015-05-30T11:53:02.737 に答える