D3.js 如何使用d3重复旋转

我想知道如何重复转换。我正在使用我自己的tsv文件。tsv文件小得多，很快结束了世界巡演。 我如何重复旋转，使其从一开始就开始

       //Globe rotating
       (function transition() {
        d3.transition()
        .duration(1500)
        .each("start", function() {
          title.text(countries[i = (i + 1) % n].name);
        })
        .style("color", "lightgreen")
        .style("text-anchor", "middle")

        .tween("rotate", function() {   
          var p = d3.geo.centroid(countries[i]),
              r = d3.interpolate(projection.rotate(), [-p[0], -p[1]]);
          return function(t) {
            projection.rotate(r(t));
            c.clearRect(0, 0, width, height); //clear the canvas for redrawing
            c.fillStyle = "black", c.beginPath(), path(land), c.fill();
            c.fillStyle = "lightgreen", c.beginPath(), path(countries[i]), c.fill();
            c.strokeStyle = "green", c.lineWidth = .5, c.beginPath(), path(borders), c.stroke(); 
            c.strokeStyle = "#000", c.lineWidth = 2, c.beginPath(), path(globe), c.stroke(); 
          };
        })
      .transition()
        .each("end", transition);
  })();
}

---

一个选项是，当它超过您列表中的国家数时，将

i

重置为零。大概是这样的：

.each("start", function() {
  i = (i + 1) % n;

  if(i >= names.length)
    i = 0;

    title.text(countries[i].name);
  })

编辑：查看世界巡演示例代码后，更简单的解决方案是将

n

重新定义为数据长度（而不是地图上的国家数）：

---

然后您可以保留代码的其余部分。此表达式中的模-

i=（i+1）%n

-在到达列表末尾后将重置为零。

当它到达末尾时，应该已经循环了。表达式

i=（i+1）%n

在到达

n

时将

i

设置回零。如果它不起作用，你需要检查原因。在序列结束后，

i

设置为什么？什么是

n

？它等于旅行中的国家数目吗？应该是。

      n = names.length;  // instead of countries.length