d3 force collapsible布局 - 所有节点折叠的起始页 [英] d3 force collapsible layout - start page with all nodes collapsed

问题描述

我只需要一个简单的布局修改
http://mbostock.github.io/d3/talk/20111116/force-collapsible.html

I just need a simple modification of the layout available here http://mbostock.github.io/d3/talk/20111116/force-collapsible.html

上述可视化从所有节点开始因此用户可以可视化完整的层次结构。唯一的问题是如果图形是密集的，形成的毛球是无意义的。

The above visualization starts with all the nodes being expanded and so the user can visualize the complete hierarchy. The only problem is if the graph is dense, and the hairball that is formed is meaningless.

我有兴趣从根节点开始，逐渐扩大所有节点。是可行吗？需要多少代码更改？

I would be interested in starting with just the root node and gradually expanding all the nodes as needed. Is it feasible? How much code change is needed?

推荐答案

我发现，工作原理是调用所有的子节点。您可以通过将以下两行插入到上面提供的示例（在脚本开头附近的d3.json调用的右下方插入这两行，在其末尾调用update）来完成此操作。

The way I found that works for this is to call the click function on all of the children nodes. You can accomplish this by inserting the following two lines to the example that you provided above (insert these two lines right underneath the d3.json call near the beginning of the script that calls "update" at the end of it)

d3.json("flare.json", function(json) {
  root = json;
  root.fixed = true;
  root.x = w / 2;
  root.y = h / 2 - 80;
  update();
});

//new code
var collapseMe = flatten(root);
for(var j = 0; j< collapseMe.length; j++){click(collapseMe[j])};

这篇关于d3 force collapsible布局 - 所有节点折叠的起始页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！