javascript - D3 v4 的 tree.links()

Question

我一直在观看有关 d3 的教程，但它显示了一些不再在 v4 上使用的过时代码。我想知道 D3 v4 的 var links = tree.links(nodes); 的更新语法是什么？

如果有人好奇，这是教程的链接。 https://www.youtube.com/watch?v=iZ6MSHA4FMU&list=PL6il2r9i3BqH9PmbOf5wA5E1wOG3FT22p&index=15

Answer 1

您必须在层次结构上调用 links()。

changelog谈论这个变化:

To generate an array of {source, target} links for a given hierarchy, use node.links; this replaces tree.links and similar methods on the other layouts.

这是一个基本演示(使用浏览器的控制台，而不是 Stack 代码段控制台):

var data = {
  "name": "Eve",
  "children": [{
    "name": "Cain"
  }, {
    "name": "Seth",
    "children": [{
      "name": "Enos"
    }, {
      "name": "Noam"
    }]
  }, {
    "name": "Abel"
  }, {
    "name": "Awan",
    "children": [{
      "name": "Enoch"
    }]
  }, {
    "name": "Azura"
  }]
};

var hierarchy = d3.hierarchy(data);

var tree = d3.tree();

var links = tree(hierarchy).links();

console.log(links)

<script src="https://d3js.org/d3.v4.min.js"></script>