web-dev-qa-db-ja.com

d3.js:強制レイアウトのノードとリンクの両方を手動で定義すると、「未定義のプロパティ「重み」を読み取れません」

この方法で、ノードとリンクの両方を同時に設定してみました。

var force = d3.layout.force()
    .size([w, h])
    .nodes(nodes)
    .links(connections)
    .start();

nodes = [{"name":"data_base_id", "kind":"subgenre"},...]
connections = [{"source":"name_of_node", "target":"name_of_other_node"},...]

接続がない可能性のあるデータがあるため、すべてのノードがレンダリングされるようにノードを定義する必要があります。そして、ジャンルの定義は非常に簡単です。しかし、私はこのエラーを受け取ります。

Cannot read property 'weight' of undefined

そして、.links(connections)をコメントアウトすると、グラフがレンダリングされます(点の束が散らばっています...)接続/リンクをd3と連携させるにはどうすればよいですか?

ドキュメントを読んでいたところ、ソースとターゲットはノード配列内のノードのインデックスである必要があるようです。それを変える方法はありますか?だから、配列にあるインデックスではなく、ノードの名前を使用できますか?

18
NullVoxPopuli

力指向レイアウトは、エッジの重みを使用してレイアウトを計算します。ダミーを追加してみてください"weight":1すべての接続に。

リンクを初期化するコードは次のようになります。

links.forEach(function(d) {
    if (typeof d.source == "number") { d.source = nodes[d.source]; }
    if (typeof d.target == "number") { d.target = nodes[d.target]; }
});

おそらく、(d3ソースで)それを微調整して、任意のプロパティ/タイプを使用することができます。

10
ZachB

以前に同じ問題が発生しました。これは、リンクのソース/ターゲットにnull値があるためです。印刷ノードおよびリンク情報はデバッグに役立つ可能性があります

18
air_bob

リンクのソース/ターゲットのnullに言及している回答に加えて、これの理由は、範囲外のソース/ターゲットの割り当てである可能性があります。例えば。 10個のノードがあり、ターゲットを11番目のインデックス付きノードに割り当てます。

11
elachell

Nullのソース値またはターゲット値を参照する上記の回答に感謝します!

http://bl.ocks.org/mbostock/4062045 からグラフをテストしてきましたが、データが欠落しているノードを参照していることがわかりました。

これは、他の人がこの問題をデバッグするのに役立つ場合があります。

d3.json("my-buggy-data.json", function(error, graph) {

    // Find blank links, which give the error
    // "Uncaught TypeError: Cannot read property 'weight' of undefined"
    graph.links.forEach(function(link, index, list) {
        if (typeof graph.nodes[link.source] === 'undefined') {
            console.log('undefined source', link);
        }
        if (typeof graph.nodes[link.target] === 'undefined') {
            console.log('undefined target', link);
        }
    });

    force
        .nodes(graph.nodes)
        .links(graph.links)
        .start();
10
ptim

ソースとターゲットにnull値がある可能性があると思います。私もこのバグを抱えていて、null値を除外することで修正しました。

5
synaptikon

私はこの問題をいくつかの方法でポップアップさせました。最近、私は次のようにエッジリストを持っていました:

{Source: 0; Target: 1}

の代わりに:

{source: 0, target: 1}
2
Ells