D3.js從節點構建鏈接？

I am referring to example shown there。D3.js從節點構建鏈接？

我無法理解d3.js如何從節點創建鏈接。讓我解釋我的理解：我們有一個js對象從代表json的文件中讀取的根;我們遞歸地獲取節點並給出ID。但後來發生的一部分，我不明白。 d3.layout.tree（）。鏈接函數如何返回鏈接？我們只通過節點來運作，那就是ids和節點的座標？

d3.json("graph.json", function(error, json) { 
    root = json; 
    update(); 
    }); 
    function update() { 
    var nodes = flatten(root), 
    links = d3.layout.tree().links(nodes);

來源

2014-02-14 Abzal Kalimbetov

樹佈局通過採用分層數據結構（在JSON中指定）並使鏈接顯式來構造鏈接。 JSON中的節點具有children屬性，隱含指定哪些節點已連接。節點連接到他們的孩子，而這些節點又連接到他們的孩子和父母。樹佈局用來計算鏈接的是這些信息。

的說：

鑑於節點，諸如那些由節點返回的指定的數組，返回表示從父到子鏈路爲每個節點的對象的陣列。葉節點不會有任何鏈接。每個鏈接是具有兩個屬性的對象：

source - 父節點（如上所述）。

target - 子節點。

該方法對於檢索適合顯示的一組鏈接描述很有用。

請注意，使用children屬性來存儲子項僅僅是您可以更改的默認值，如果您願意的話。

來源

2014-02-14 08:49:19

+1 Lars的回答比我的好得多。我經常得到他的幫助;阿布扎爾，我會記下他的答案！ – ericmjl

在update()功能，links = d3.layout.tree().links(nodes);是「選擇」樹在JSON文件其指定的鏈接節點。

我覺得這裏的關鍵是在JSON文件中的，不僅應該有節點，而且應該有指定的鏈接。否則，只能得到節點。我相信this page也應該有所幫助。

至於後來發生了什麼代碼，如果它是有幫助的，請繼續往下看......

後來，現有鏈接樹link = link.data(links, function(d) { return d.target.id; });更新。

稍後，下面的代碼塊會輸入當前不存在於圖表中的新鏈接。

// Enter any new links. 
    link.enter().insert("line", ".node") 
     .attr("class", "link") 
     .attr("x1", function(d) { return d.source.x; }) 
     .attr("y1", function(d) { return d.source.y; }) 
     .attr("x2", function(d) { return d.target.x; }) 
     .attr("y2", function(d) { return d.target.y; });

我希望這有助於！

來源

2014-02-14 06:12:03 ericmjl

你的意思是說d3.layout.tree（）。links（）函數是指從文件中讀取的一些全局屬性來查找鏈接？ –

D3.js從節點構建鏈接？

回答

相關問題