Javascript d3.js force layout graph:如何从头构建nodes对象?

Javascript d3.js force layout graph:如何从头构建nodes对象?,javascript,json,hyperlink,d3.js,nodes,Javascript,Json,Hyperlink,D3.js,Nodes,我正在尝试根据自己的需要调整以下d3.js force布局: 当我使用以下json文件时,所有内容都显示良好(2个节点和1个链接): 然后我想从头开始构建nodes对象;因此,在上述参考示例中,我将flatte()函数替换为以下函数: function flatten1() { var nodes = []; var node = {name: 'child1', size: 100, id: 1}; nodes.push(node);

我正在尝试根据自己的需要调整以下d3.js force布局:

当我使用以下json文件时,所有内容都显示良好(2个节点和1个链接):

然后我想从头开始构建nodes对象;因此,在上述参考示例中,我将
flatte()
函数替换为以下函数:

    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文件)类似,但存在一个显示问题:两个节点都正常,但链接从父节点到svg块的左上角

我错过了什么?
任何帮助都将非常感谢。

我想您作为子节点传递到第二个节点的节点需要是对第一个节点的引用,而不是您正在创建的新对象。试试这个

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;
}
如果这是可行的,那么它将为您提供一些关于如何塑造展平算法其余部分的想法

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