Javascript 如何选择特定的d3节点组元素

我有一个有几个节点的D3V4力模拟。每个节点都有一个组。当我将鼠标移到该组的一个元素（一个不可见的圆）上时，我希望其他元素中的一个（仅在特定节点上的红色圆，我给了它一个“backcircle”id）来做一些事情。目前，这就是我所拥有的，但它对所有节点都是如此，而不仅仅是我悬停在其元素上的节点

this.node = this.d3Graph.selectAll(null)
.data(this.props.nodes)
.enter()
.append("g")
.attr("class", "nodes");

this.node.append("circle")
.attr("id", "backCircle")
.attr("r", 60)
.attr("fill", "red")


this.node.append("svg:image")
        .attr("xlink:href", function(d) { return d.img })
        .attr("height", 60)
        .attr("width", 60)
        .attr("x", -30)
        .attr("y", -30)


          this.node.append("circle")
            .attr("r", 60)
            .attr("fill", "transparent")
            .on( 'mouseenter', function(d) {
              d.r = 65;
              this.node.select("#backCircle")
              .transition()
              .attr("r", 80);

            }.bind(this))

---

我认为您需要选择从其处理程序中触发mouseenter事件的节点

      this.node.append("circle")
        .attr("r", 60)
        .attr("fill", "transparent")
        .on( 'mouseenter', function(d) {
          var mouseenterNode = d3.select(this) 
          mouseenterNode.attr("r", 65);
          mouseenterNode.select("#backCircle")
          .transition()
            .attr("r", 80);
        }.bind(this))

---

在此之前，有两个重要提示：

不要在SVG中使用

“透明”

ID是唯一的。因此，请改用类（或按标记名选择）

回到你的问题：

基于兄弟圆元素选择圆元素有几种方法。第一个是使用

this.parentNode

在DOM中上下移动。第二个，如果您确切知道兄弟姐妹的顺序，则使用

previousSibling

在下面的演示中，每组有3个元素：一个圆、一个文本和一个矩形。将鼠标悬停在矩形上将选择圆

首先，使用

this.parentNode

选项。就你而言：

d3.select(this.parentNode).select(".backCircle")

将鼠标悬停在方块上：

var svg=d3.选择（“svg”）；
var数据=[50150250]；
var g=svg.selectAll（空）
.数据（数据）
.输入（）
.附加（“g”）
.attr（“转换”，函数（d）{
返回“translate（“+d+”，75）”
});
g、 附加（“圆圈”）
.attr（“类”、“回圈”）
.attr（“r”，40）
.attr（“填充”、“teal”）
g、 附加（“文本”）
.attr（“字体大小”，20）
.attr（“文本锚定”、“中间”）
.文本（“FOO”）；
g、 附加（“rect”）
.attr（“x”，20）
.attr（“y”，20）
.attr（“宽度”，20）
.attr（“高度”，20）
.样式（“填充”、“耐火砖”）
.on（“mouseenter”，function（）{
d3.select（this.parentNode）。选择（“.backCircle”）
.transition（）
.attr（“r”，50）
}).on（“mouseleave”，函数（）{
d3.select（this.parentNode）。选择（“.backCircle”）
.transition（）
.attr（“r”，40）
})

这是一个好主意，但当我尝试它时，它什么也没有做。如果你在你的问题中添加了一个有用的提琴，我会再看一看。谢谢！这很有魅力。当你说不要使用“透明”时，可以使用“不透明度”“0”吗？