2017-01-24 2 views
3

現在、d3js v4で強制有向グラフを作成しようとしています。私は、次のノードとリンクを持って、実際にはかなり簡単なD3js強制有向グラフリンクが見つかりません

ノード

[ 
    { 
    "id":"4d2b0275-5bc7-e611-81c4-00155df7ea33" 
    },{ 
    "id":"b32b0275-5bc7-e611-81c4-00155df7ea33" 
    } 
] 

リンク

[ 
    { 
    "source":"4d2b0275-5bc7-e611-81c4-00155df7ea33", 
    "target":"b32b0275-5bc7-e611-81c4-00155df7ea33" 
    } 
] 

私forceSimulationのセットアップは、それがd3.forceLinkにエラーがスローされます

var simulation = d3.forceSimulation(nodes) 
    .force("charge", d3.forceManyBody()) 
    .force("link", d3.forceLink(links).distance(20).strength(1)) 
    .force("x", d3.forceX()) 
    .force("y", d3.forceY()) 
    .stop() 

ですUncaught Error: missing: 4d2b0275-5bc7-e611-81c4-00155df7ea33とのリンク(リンク)。 リンクは実際にそこにあるので、なぜそのエラーですか? D3、デフォルトlink.id()アクセサ関数で

答えて

4

は、各リンクのソースとターゲットノードの配列にゼロベースのインデックスとして指定することを可能にします。

これは、ソースとターゲットがAPIで、この例のように、ノードのインデックスによって定義されていることを意味します

var links = [ 
    {"source": 0, "target": 1}, //from the first node to the second 
    {"source": 1, "target": 2} //from the second node to the third 
]; 

しかし、あなたがソースとターゲットを定義しているので、数値インデックスではなくノードのidによって、このIDを

.force("link", d3.forceLink(links) 
    .id(function(d,i) { 
     return d.id 
    }) 
    .distance(20) 
    .strength(1) 
) 
の関数で指定する必要があります。
関連する問題