버전

코드

mouse 이벤트 추가

addHover() {
    this.element.on("mouseover", this.mouseovered(true))
    .on("mouseout", this.mouseovered(false));
}

조상 요소 하이라이트

코드

mouseovered(active) {

    return function(d) {

      var paths = d3.selectAll("path");

      if(active) {
        let ancestors = d.ancestors();

        //ハイライト
        paths.filter((d) => ancestors.includes(d))
        .style("stroke", "#f00");

      } else {
        //ハイライトやめて、デフォルトの色に変更
        paths.style("stroke", "#555");
      }
    };
  }

node.ancestors()

includes