recursion - d3.js 中的转换队列；逐个

Question

我尝试在 d3.js 中进行链式转换。为此，我在数组中定义了一组转换，并(尝试)创建一个函数以使用 .each("end", function()) 递归调用它们，以在前一个为完成，但我还没有结果。

Action 列表

    animations = [  function(){  console.log(1); return circle.transition().duration(2e3).attr("cy", Math.random()*300); } ,
                    function(){  console.log(2); return rect.transition().duration(3e3).attr("fill", "#"+((1<<24)*Math.random()|0).toString(16)); },
                    function(){  console.log(3); return circle.transition().duration(1e3).attr("r", Math.random()*500); },
                    function(){  console.log(4); return circle.transition().duration(2e3).style("fill", "#"+((1<<24)*Math.random()|0).toString(16)); },
                    function(){  console.log(5); return circle.transition().duration(1e3).attr("cx", Math.random()*500); }]

递归函数

    function animate(index){
        if(index < animations.length - 1){
            index = index + 1
            return animations[index]().each("end", animate(index))
        } else {
            return true
        }
    }

jsfiddle 是 here , this是一个使用递归函数的例子。

提前谢谢大家。

Answer 1

你快到了!

代替

return animations[index]().each("end", animate(index))

你需要

return animations[index]().each("end", function() { animate(index) })

参见 updated jsFiddle