javascript - D3 : looping transition with dynamic name

Question

我知道当谈到 D3 时，您不能真正使用 javascript 循环来转换事件。但是，您是否知道为什么不能使用动态名称(例如动态路径名)？出于某种原因，以下内容不起作用(我想做的就是让日本在 map 上持续“发光”......)

请注意:动画的第一部分有效，日本变红了。然后动画停止，即使控制台正确生成“#Japan”并循环到无穷大。

paz = "#Japan";
glowit(paz)

function glowit(paz){
console.log(paz);
d3.select(paz)
  .transition()
  .style("fill", "red")
  .duration(1000)
  .each("end", function(){
     d3.select(paz)
       .transition()
       .style("fill", "white")
       .duration(1000)
       .each("end", glowit("#" + this.id))
  });
}

亲切的问候 - 谢谢你， G.

Answer 1

一个问题可能是您调用 glowit() 而不是将函数作为参数传递给each()。您需要将其包装在一个函数中:

function glowit(paz){
  console.log(paz);
  d3.select(paz)
    .transition()
    .style("fill", "red")
    .duration(1000)
    .each("end", function(){
       d3.select(paz)
         .transition()
         .style("fill", "white")
         .duration(1000)
         .each("end", function () {
            glowit("#" + this.id);
         });
    });
}