我怎样才能隐藏一个节点的祖先的名字

Question

我是 d3 的新手，我正在尝试用 d3 圆形包装来表示代码模型。问题是类和界面太多，圆圈的标签很难看懂。我发现我可能需要隐藏 parent 节点的名称以使事情更清楚，如下所示：

var node = svg.append("g").selectAll("circle")
    .data(root.descendants())
    .join("circle")
    .on("mouseover", d =>{
      //hide the label of the parent of the node
         var parentNodeLabel = label.filter((e) =>{

            return e == d.parent;
        })
        .style("fill-opacity", "0")
        })
     }

它按预期工作，但后来我意识到只隐藏 parent 的名字并没有多大作用，所以现在我试图隐藏所有祖先的名字。我试过这样：

.on("mouseover", function(d) {
        var ancestorNodeLabels = label.filter((e) =>{
            return e == d.ancestors().slice(1);
        })
        .style("fill-opacity", "0")
        })
}

但它似乎根本不起作用。我需要有关如何完成我想做的事情的提示。

Answer 1

算了，我就是傻。我需要检查 e 是否包含在祖先中而不是将它分配给他们。

var ancestorNodeLabels = label.filter((e) =>{
            return (d.ancestors().slice(1)).includes(e);
        })
        .style("fill-opacity", "0")

我怎样才能隐藏一个节点的祖先的名字

how can i hide the names of ancestors of a node

javascript

filter

d3.js

circle-pack