Question

我正在使用此示例作为基础： http://mbostock.github.io/d3/talk/20111018/tree.html

在我的代码中，我开始折叠所有节点，用户可以单击分支来导航树，就像在演示中一样。

为方便用户，我想使用jQuery来切换扩展/折叠root的所有子节点。下面的代码只会切换根的直接子项。

我尝试了很多选项，但我无法找到正确的功能。任何帮助将不胜感激。

$('.clicktoexpandALL').click(function(){
    toggle(root);
    update(root);
});

我试过toggle(root.children[0])＆amp; toggle(root.children[1].children[2]);无济于事。

编辑：更新的问题。

如果我可以访问toggleAll(d)函数，我可以做我想要的但是一个简单的函数调用不会工作。

d3.json（“json / results.json”，function（json）{ root = json; root.x0 = h / 2; root.y0 = 0;

function toggleAll(d) {
  if (d.children) {
    d.children.forEach(toggleAll);
    toggle(d);
  }
}

// Initialize the display to hide nodes.
root.children.forEach(toggleAll);

update(root);

}）;

添加了JSFIDDLE链接

代码 http://jsfiddle.net/chrisloughnane/vV3Sc/

全屏 http://jsfiddle.net/chrisloughnane/vV3Sc/show/

Answer 1

我认为您需要使用方法toggleAll来切换根节点及其下的子节点：

function toggleAll(d) {
  if (d.children) {
    d.children.forEach(toggleAll);
    toggle(d);
  }
}

toggle方法将隐藏/显示根的属性children，但不显示其他节点的子节点。

D3树布局：我想使用jQuery来切换所有孩子

1 个答案: