Question

我刚才有一个关于改变股票径向树行程路径颜色的快速问题，Mike Bostock

https://bl.ocks.org/mbostock/4063550

例如，如果我可以更改子链接的颜色，例如：

var link = g.selectAll(".link")
    .data(root.descendants().slice(1))
    .enter().append("path")
      .attr("class", "link")
      .style("fill", "none")
      .attr("d", function(d) {
        return "M" + project(d.x, d.y)
            + "C" + project(d.x, (d.y + d.parent.y) / 2)
            + " " + project(d.parent.x, (d.y + d.parent.y) / 2)
            + " " + project(d.parent.x, d.parent.y);
      });


    link.attr('stroke', function(d) {
       if (d.id.startsWith("Root.Item1")){
          return "#386eff";
        }

        if (d.id.startsWith("Root.Item2")){
          return "#45cbf2";
        }
        else return '#70f2ad';
        });

这将更改以Root.Item2

开头的数据的所有链接颜色

即。 Root.Item2.Child1和Root.Item2.Child2

将具有相同的颜色。

然而，如果我只想突出Root.Item2.Child2的路径并将其他链接保持相同的颜色呢？

这个概念类似于突出显示以Root开头并以Child2结尾的路径？

由于

Answer 1

通过检查节点的d.children，我能够以迂回的方式解决这个问题。不确定它是否理想，但如果其他人希望做类似的事情，它就会起作用。

if (d.id.startsWith("Root.Item2")) {
                for (var i = 0; i < d.children.length; i++ ) {
                    if (d.id.startsWith("Root.Item2.Child1") |
                    ) {
                        return "red";
                    }
                }

d3径向树高亮路径

1 个答案: