Question

我正在尝试更改以下代码

d3.json("readme.json", function(root) {
  hierarchy.nodes(root);
  x.domain([0, root.value]).nice();
  down(root, 0);
});

到JSON.parse（一些数据）。我没有拉动JSON数据的问题，但我对使用hierarchy.node（root），x.domain和down（root）

Answer 1

在对这个函数的内容有所了解之前，您可能需要阅读更多文档。这是一个棘手的例子;我只想带你了解我想要理解的过程。逐行：

d3.json("readme.json", function(root) {

这将加载引用的json file并使用它调用函数。 'root'开始等于json文件。

  hierarchy.nodes(root);

查看代码，我们找到声明层次结构的位置：

var hierarchy = d3.layout.partition()
    .value(function(d) { return d.size; });

所以层次结构是某种layout，而hierarchy.nodes会向root添加一些有用的属性，这样可以更容易地进行图形化。

  x.domain([0, root.value]).nice();

在我们找到x = d3.scale.linear().range([0, w])的示例中搜索“x”。似乎x是linear scale。基本上，x函数会将域中的值 - [0, root.value]转换为范围[0, w]。 w是svg的宽度。 root.value有点棘手。节点页面显示

value - 值访问器
返回的节点值

但是价值访问者是什么？最初的声明表明它与root的'size'属性有一些东西，但是什么？此时，文档开始变得非常混乱，因此您可能希望弹出调试器并确切地查看root和root的子项的value属性。

down(root, 0);

向下功能对于示例是唯一的，并且评论很好。在参考文档的同时尝试阅读它，看看你是否能搞清楚。