如何转换为D3的JSON格式?

虽然遵循大量的D3示例,但数据通常采用flare.json中给出的格式进行格式化 :

{ "name": "flare", "children": [ { "name": "analytics", "children": [ { "name": "cluster", "children": [ {"name": "AgglomerativeCluster", "size": 3938}, : 

我有一个邻接表如下:

 A1 A2 A2 A3 A2 A4 

我想要转换为上面的格式。 目前,我在服务器端做到这一点,但有没有办法使用D3的function来实现这一点? 我在这里find了一个,但是这个方法似乎需要修改d3核心库,由于可维护性,我不赞成。 有什么build议么?

没有规定的格式,因为通常可以通过各种访问器函数(如hierarchy.children )和array.map来重新定义数据。 但是你引用的格式可能是树的最方便的表示方式,因为它与默认访问器一起工作。

第一个问题是你打算显示一个graphics还是一棵树 。 对于图,数据结构是根据节点和链接定义的。 对于树,布局的input是根节点,它可能有一个子节点数组,其叶节点有一个关联的值 。

如果你想显示一个 ,而你所拥有的只是一个边的列表,那么你就需要遍历边来产生一个节点数组和一个链接数组。 假设你有一个名为“graph.csv”的文件:

 source,target A1,A2 A2,A3 A2,A4 

你可以使用d3.csv加载这个文件,然后生成一个节点和链接的数组:

 d3.csv("graph.csv", function(links) { var nodesByName = {}; // Create nodes for each unique source and target. links.forEach(function(link) { link.source = nodeByName(link.source); link.target = nodeByName(link.target); }); // Extract the array of nodes from the map by name. var nodes = d3.values(nodeByName); function nodeByName(name) { return nodesByName[name] || (nodesByName[name] = {name: name}); } }); 

然后,您可以将这些节点和链接传递给强制布局以可视化graphics:

如果你想产生一个 ,那么你需要做一个稍微不同的数据转换forms来累积每个父节点的子节点。

 d3.csv("graph.csv", function(links) { var nodesByName = {}; // Create nodes for each unique source and target. links.forEach(function(link) { var parent = link.source = nodeByName(link.source), child = link.target = nodeByName(link.target); if (parent.children) parent.children.push(child); else parent.children = [child]; }); // Extract the root node. var root = links[0].source; function nodeByName(name) { return nodesByName[name] || (nodesByName[name] = {name: name}); } }); 

像这样:

D3不需要特定的格式。 这一切都取决于你的应用程序。 您当然可以将邻接列表转换为flare.json中使用的格式,但是这也将是特定于应用程序的代码。 一般来说,你不能把它作为邻接表,因为它没有你需要构build树的“head”或“root”元素。 另外,你需要分别处理周期,孤儿等。

鉴于您目前正在服务器端进行转换,我会试图说“如果没有损坏,请不要修复”;)