Question

我正在尝试根据自己的需要调整以下d3.js力布局：
http://bl.ocks.org/mbostock/1093130

当我使用以下json文件时，一切正常（2个节点和1个链接）：

    {
     "name": "parent",
     "children": [
          {"name": "child1", "size": 100}
     ]
    }

然后我想从头开始构建节点对象;因此，在上面提到的参考示例中，我将flatten()函数替换为以下函数：

    function flatten1() {
      var nodes = [];
      var node = {name: 'child1', size: 100, id: 1};
      nodes.push(node);
      node = {name: 'parent', children: [{name: 'child1', size: 100, id: 1}], id: 2};
      nodes.push(node);
      return nodes;
    }

，update()函数现在以：

开头

var nodes = flatten1(),
links = d3.layout.tree().links(nodes);

当然，我不再使用json文件了当我检查节点和链接的内容时，它看起来类似于以前工作的代码（使用json文件），但是有一个显示问题：2个节点没问题，但链接从父节点到左上角svg区块的一角...

我错过了什么？任何帮助都会得到很大的帮助。

Answer 1

我猜你作为子节点传递给第二个节点的节点需要是对第一个节点的引用，而不是你正在创建的新对象。试试这个;

function flatten1() {
  var nodes = [];
  var node1 = {name: 'child1', size: 100, id: 1};
  nodes.push(node1);
  var node2 = {name: 'parent', children: [node1], id: 2};
  nodes.push(node2);
  return nodes;
}

如果可以，那么它可以让您了解如何塑造其余展平算法。

d3.js强制布局图：如何从头开始构建节点对象？

1 个答案: