Dom 圆圈元素未被访问

我希望用d3制作圆形动画。我想展示鼠标悬停时圆圈的生长。为此，我使用了以下代码。代码运行时不会出错，因为它不会生成任何圆动画。任何我做错的地方的建议。请参阅下面的代码

  var vis = d3.select(e).append("svg")
  .attr("width", svgwidth)
  .attr("height", svgheight);

   var circles = vis.selectAll("circle").data(sampleData);
   var circleEnter=circles.enter().append("g").append("circle");

    var circles = vis.selectAll("circle").data(sampleData);
    var circleEnter=circles.enter().append("g").append("circle");

    circleEnter.attr("cx", function (d,i) 
            {
             Cxs[i]= xRange (d.x);
             return xRange (d.x); 
             })

    .attr("cy", function (d,i) {
        Cys[i]= yRange (d.y); return yRange (d.y);
        })

    .attr("r", 20)
    .style("fill-opacity", .2)
    .style("fill", fillColor) 

    .on("mouseover", function(d,i)
            { 


        d3.select(this).select("circle").transition()
        .duration(750)
        .attr("r",30);
  }

     .on("mouseout", function(d,i)
            { 


        d3.select(this).select("circle").transition()
        .duration(750)
        .attr("r",20);
  }

---

您只需要

d3。选择（此）

——这将已经选择

圆

元素：

.on("mouseover", function(d,i) {
    d3.select(this).transition()
    .duration(750)
    .attr("r",30);
}).on("mouseout", function(d,i) { 
    d3.select(this).transition()
    .duration(750)
    .attr("r",20);
})

---

非常感谢。它起作用了，但是我想知道，如果我想将相同的转换应用到它的两个相邻的圆上，该怎么办。例如，如果我将鼠标移到一个圆上，我希望它周围的圆缩小。为此，我使用了以下.on（“mouseover”，函数（d，i）{d3.select（this）.circles（i+1）.transition（）.duration（750.attr（“r”），20）；但它返回错误。我希望得到任何建议。注意。在这种情况下，我会将id分配给元素，使它们易于以这种方式选择，例如，基于索引的内容：

.attr（“id”，function（d，I）{return“idx”+I；}）

然后

d3.select（“idx”+（I+1））.transition（）…

。谢谢。我确实使用了您建议的编码，但我发现它不起作用。我进一步取消了它的标记，发现它没有创建任何具有此id的对象（返回“idx”+i），为了检查这一点，我使用了d3.select（“idx”+i）.attr（“id”）未捕获的TypeError:无法读取属性“getAttribute”。任何错误、键入--都应该是

d3。选择（“#idx”+（i+1））

。谢谢，我刚刚发现了同样的问题。它成功了。再次感谢您的建议。