D3交错动画

ajm*_*jma 0 javascript d3.js

我正试图错开进入(和转换,但从输入开始)动画为我正在努力的d3作品.不可否认,我对这个D3没有很好的把握,因为我刚刚开始使用它,但这是我正在尝试的 -

nodeEnter.append("text")
  .transition()
  .delay(100)
   .each("start", function() { 
      d3.select(this)
    .attr("dy", ".35em")
    .text(function(d) { return d.name; });
  });
Run Code Online (Sandbox Code Playgroud)

因此,预期的效果是使每个输入转换延迟前一个的60ms.有点像我要循环并做一些像delay = i*60.我很感激任何指导.谢谢!

mee*_*mit 5

d3 delay()接受像其他方法一样的函数:

nodeEnter.append("text")
  .attr("dy", "0em")// <-- May or may not be needed
  .transition()
  .delay(function(d, i) { return i*60; })// <-- delay as a function of i
  .attr("dy", ".35em")
  .text(function(d) { return d.name; });
Run Code Online (Sandbox Code Playgroud)

  • 该死的,打败了我.这是一个显示@ meetamit延迟的示例:http://plnkr.co/edit/OWNmWfi4aVMUPNV1yvUO?p = preview (2认同)