d3徑向樹高光路徑

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，我能夠以一種about回的方式解決這個問題。 不確定它是否理想，但是如果其他人希望做類似的事情，它會起作用。

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