Angularjs D3-如何选择最近添加的元素

我使用D3.js将

圆圈

添加到绘图中，圆圈需要添加一个超时（用于动画），因此我使用

设置超时

这些圆圈还需要在其上注册

mouseover

和

click

事件处理程序，但我无法选择最近添加的元素在侦听器上注册

代码如下：

 (salesDataToPlot.graphObj.eventData).forEach(

        function(d,i){


                setTimeout(
                  function(){
                    console.log(d.collectTime);

                    svg.append("circle")
                       .transition()
                       .duration(1000)

                       .attr("cx", function() { 
                        //console.log(new Date( d.collectTime.substr(0,10) ) );
                        return xScale(new Date( d.collectTime.substr(0,10) ) );
                       })
                      .attr("cy", function() {
                        //console.log(d.value);
                        return yScale( (d.value - min)/(max-min));
                      })
                      .attr("r", function() {
                        return 5;
                      })
                      .attr("clip-path","url(#clip)")
                      .attr("class","circle")
                      //.attr("ng-class","{ 'graphClass':!chartData.graphObj.showEventMarkers }")
                      .style("fill", eventStrokeColor)
                      ;
                }, 1000+ i*100);
      });

此代码添加带超时的圆圈

现在，我不确定在哪里以及如何在

侦听器上添加

的代码，如

.on("mouseover", function(d)
                      {
                        tooltip.style("visibility", "visible");
                        tooltip.style("background-color",eventStrokeColor);
                        tooltip.html("<div style='color:black'>" + d.eventType + "</div>" + d.eventSentence);
                      })

.on（“鼠标悬停”，函数（d）
{
工具提示。样式（“可见性”、“可见”）；
样式（“背景色”，eventStrokeColor）；
html（“+d.eventType+”+d.EventSession）；
})
当您将圆装箱并将其附加到svg时，可以添加如下内容：

 var ci = svg.append("circle")
                   .transition()
                   .duration(1000)
        .attr("fill", "aliceblue")
        .attr("r", 50)
        .attr("cx", cx)
        .attr("cy", cy);
ci
        .on("mouseover", function () {//adding listeners
        return tooltip.style("visibility", "visible");
    })
        .on("mousemove", function () {
        return tooltip.style("top", (event.pageY - 10) + "px").style("left", (event.pageX + 10) + "px");
    })
        .on("mouseout", function () {
        return tooltip.style("visibility", "hidden");
    });

我已经做了一个演示，使用两个圆圈的setInterval第一个圆圈在3秒后出现，第二个圆圈在6秒后出现

完整工作代码

希望这有帮助！：）
 当您将圆装箱并将其附加到svg中时，可以添加如下内容：

 var ci = svg.append("circle")
                   .transition()
                   .duration(1000)
        .attr("fill", "aliceblue")
        .attr("r", 50)
        .attr("cx", cx)
        .attr("cy", cy);
ci
        .on("mouseover", function () {//adding listeners
        return tooltip.style("visibility", "visible");
    })
        .on("mousemove", function () {
        return tooltip.style("top", (event.pageY - 10) + "px").style("left", (event.pageX + 10) + "px");
    })
        .on("mouseout", function () {
        return tooltip.style("visibility", "hidden");
    });

我已经做了一个演示，使用两个圆圈的setInterval第一个圆圈在3秒后出现，第二个圆圈在6秒后出现

完整工作代码

希望这有帮助！：）
 看起来您是在svg元素上附加侦听器，而不是在circlesNo gaurav上。西里尔已经把听众和圈子联系起来了。请注意，
append
函数返回附加的元素本身。确定。。。。看着代码…看起来监听器被附加到svg元素上…但实际上它工作得很好。没有gaurav，在d3 d3中。选择（“.example_div svg”）。append（“svg:circle”）返回我攻击监听器的圆DOM元素。我收到的错误是“svg.transition（）.append（）.on（）”不是函数，似乎transition（）函数不返回对object的引用似乎是在svg元素上附加侦听器，而不是在circlesNo gaurav上。西里尔已经把听众和圈子联系起来了。请注意，
append
函数返回附加的元素本身。确定。。。。看着代码…看起来监听器被附加到svg元素上…但实际上它工作得很好。没有gaurav，在d3 d3中。选择（“.example_div svg”）。append（“svg:circle”）返回我攻击监听器的圆DOM元素。我收到的错误是“svg.transition（）.append（）.on（）”不是函数，似乎transition（）函数不返回对对象的引用