仅从链接数据构造力导向图

use*_*220 8 json d3.js force-layout

我对d3.js有点新鲜,但我对它有很多乐趣.到目前为止,我已经实现了一个强制导向图,它非常接近许多示例和教程.

直接关注

像许多例子一样,我有一个像这样的JSON结构:

{"nodes": ["node1", "node2",  ... ],
 "links": [{source: 0, target: 1, "field1": 5, ...}, ... ]}
Run Code Online (Sandbox Code Playgroud)

但是,我认为构建我的数据源会更容易:

{"links": [
    {source: "node1", target: "node2", "field1": 5, ...},
    {source: "node2", target: "node4", "field1": 1, ...},
    {source: "node3", target: "node4", "field1": 8, ...}
]}
Run Code Online (Sandbox Code Playgroud)

它们不是在我的图中显式定义节点,而是在链接结构中隐式定义.

原因

我想列出项目的最终目标,以防有人有一些特定的示例代码或惯用的方法,我不知道这样做.

该项目的目标最终将是一个实时更新的图表.后端正在开发中,需要进行一些更改和修改.

目前,我想象每X秒下拉一次更新JSON提要并使用新信息更新该图的结构.拉取的Feed只包含图形的更新结构,因此如果需要,脚本需要维护所有已拉动的节点和链接并添加任何新的节点和链接.

谢谢!

如果以前曾经问过我,我道歉.我做了一些搜索,没有找到任何东西.如果我错过了,请随意侮辱和指责我.

foz*_*eat 4

我不得不这样做几次。我发现的最简单的方法是简单地计算基于链接列表的节点集,然后将其转换为一个数组以供力图使用:

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);
Run Code Online (Sandbox Code Playgroud)