d3强制图形隐藏继承链接

Question

我创建了一个小的强制图。每个节点都有一个"父节点"。属性，该属性包含"父"。如果用户单击父节点，则所有子节点都将崩溃。我使用类似的条件来隐藏链接。

function click(d) {
if (boolOpacity == true) {
nodes.filter((n) => {
icons.filter((m) => {
return m.parent == d.id
}).style("display", "none")
return  n.parent == d.id
}).style("display", "none")
links.filter((e) => {
return e.target.id == d.id
}).style("display", "none")
boolOpacity = false 
} else {
nodes.filter((n) => {
icons.filter((m) => {
return m.parent == d.id
}).style("display", "block")
return n.parent == d.id
}).style("display", "block")
links.filter((e) => {
return e.target.id == d.id
}).style("display", "block")
boolOpacity = true

}
}

我的问题是继承。目前只有直接邻国陷入崩溃。我需要一个类似d3树布局函数的强制图。在那里根节点折叠所有东西等等

欢迎任何想法、提示甚至伪代码。

Answer 1

这当然是一个快速而肮脏的解决方案。此外，有必要在依赖于级别的情况下添加另一个条件，但最终它是动态工作的。

隐藏:

links.filter((a) => {
if(a.target.id == d.id) {
links.filter((b) => {
if(b.target.id == a.source.id) {
links.filter((c) => {
return c.target.id == b.source.id
}).style("display", "none")
}
return b.target.id == a.source.id
}).style("display", "none")
}
return a.target.id == d.id
}).style("display", "none")

显示:

links.filter((a) => {
if(a.target.id == d.id) {
links.filter((b) => {
if(b.target.id == a.source.id) {
links.filter((c) => {
return c.target.id == b.source.id
}).style("display", "block")
}
return b.target.id == a.source.id
}).style("display", "block")
}
return a.target.id == d.id
}).style("display", "block")