如何转换成D3的JSON格式？

Question

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

我有一个邻接列表如下：

A1 A2
A2 A3
A2 A4

我想把它转换成上面的格式。目前，我正在服务器端做这件事，但是有没有一种方法可以使用D3的功能来实现这一点呢？我在这里找到了一个，但该方法似乎需要修改d3核心库，由于可维护性，我不赞成。有什么建议吗？

Answer 1

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

第一个问题是您打算显示的是图还是树。对于图，数据结构是根据节点和链接定义的。对于树，布局的输入是根节点，根节点可能具有子节点数组，其叶节点具有关联的值。

如果您想显示一个图，而您所拥有的只是一个边的列表，那么您将需要在边上迭代，以便生成一个节点数组和一个链接数组。假设您有一个名为“graph.csv”的文件：

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

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});
  }
});

然后可以将这些节点和链接传递到force布局以使图形可视化：

• http://bl.ocks.org/2949937

如果您想生成一个树，那么您将需要执行一个稍微不同形式的数据转换来为每个父节点累积子节点。

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});
  }
});

null