僅從鏈接數據構造力導向圖

我對d3.js有點新，但是我對它有很多樂趣。到目前爲止，我已經實現了一個非常接近許多示例和教程的強制定向圖。僅從鏈接數據構造力導向圖

直接關心

像很多的例子，我有一個JSON結構是這樣的：

{"nodes": ["node1", "node2", ... ], 
"links": [{source: 0, target: 1, "field1": 5, ...}, ... ]}

不過，我認爲，這將是更容易構造我的數據來源是這樣的：

{"links": [ 
    {source: "node1", target: "node2", "field1": 5, ...}, 
    {source: "node2", target: "node4", "field1": 1, ...}, 
    {source: "node3", target: "node4", "field1": 8, ...} 
]}

而不是顯式定義我的圖中的節點，它們隱式地定義在鏈接結構中。

原因

我想列出萬一有人有一些具體的示例代碼或做這裏面的我不知道的慣用方式，項目的最終目標。

該項目的目標最終將是一個實時更新的圖表。後端正在開發中，可能會發生一些變化和修改。

目前，我正在想象每隔X秒拉下更新的JSON feed並用新信息更新該圖的結構。拉動的飼料只會包含圖形的更新結構，因此如果需要，腳本需要維護所有已拉動的節點和鏈接並添加新的節點。

謝謝！

如果之前詢問過，我表示歉意。我做了一些搜索，沒有找到任何東西。如果我錯過了，請隨時侮辱和反駁我。

來源

2012-07-13 user1524220

我不得不這樣做幾次。我找到的最簡單的方法是簡單地計算節點集合，然後將其轉換爲用於力圖的陣列：

var links = [ .... ]; 
var nodeMap = {}; 
links.forEach(function(d, i) { 
    nodeMap[d.source] = true; 
    nodeMap[d.target] = true; 
}); 

var nodes = []; 
for (key in nodeMap) 
    nodes.push(key); 

d3.layout.force() 
     .nodes(nodes) 
     .links(links);

來源

2012-09-03 03:02:10 fozziethebeat

我已經在例子「D3 Based Force Directed Radial Graph」中做了這個。我這樣做是因爲我想了解數據如何在內部獨立於像JSON和CSV這樣的結構，而這些結構可以在以後進行分層。

無論如何，我希望這個例子能幫助你。

我最好的，

弗蘭克

來源

2012-07-29 20:30:45

僅從鏈接數據構造力導向圖

回答

相關問題