Question

我已经在这里待了几天了，我已经在stackoverflow和其他地方看到了这些问题，但我遗漏了一些东西。

假设我们有以下JSON：

{
  "nodes":[
    {"name":"node1"},
    {"name":"node2"},
    {"name":"node3"},
    {"name":"node4"}
 ],
  "links":[
    {"source":"node1","target":"node2"},
    {"source":"node1","target":"node3"},
    {"source":"node1","target":"node4"}
  ]
}

为什么以下两段代码在控制台中产生相同的输出，但第二段给出了一个错误（Uncaught TypeError：无法读取属性＆＃39; push＆＃39; of undefined）？

links = links.map(function(l) {
  var sourceNode = nodes.filter(function(n) { return n.name === l.source; })[0];
  var targetNode = nodes.filter(function(n) { return n.name === l.target; })[0];
  return {
    source: sourceNode,
    target: targetNode
  };
});

_

links.forEach(function(link) {
  link.source = {name: link.source};
  link.target = {name: link.target};
});

控制台输出：

[{"source":{"name":"node1"},"target":{"name":"node2"}},
 {"source":{"name":"node1"},"target":{"name":"node3"}},
 {"source":{"name":"node1"},"target":{"name":"node4"}}]

Answer 1

2个代码段的结果之间存在一个显着差异。

第一个通过引用链接source和target个节点。它们指向nodes数组中的对象。

第二个创建新对象。它们与nodes中的名称相同，但它们在内存中是不同的对象。

D3强制布局要求链接通过引用或数组中的索引指向节点。如果您指定索引，它们仍会transformed to references：

注意：source和target属性的值最初可以指定为nodes数组的索引;在调用start之后，这些将被引用替换。

d3使用节点名称强制图表链接

1 个答案: