3

d3.js でチェーン遷移を作成しようとしました。このために、一連のトランジションを配列で定義し、(試して) を使用してそれらを再帰的に呼び出す関数を作成し.each("end", function())、前のトランジションが終了したときにトランジションを開始しますが、まだ結果がありません。

アクション一覧

    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 はこちらです。これは再帰関数を使用した例です。

よろしくお願いします。

4

1 に答える 1

5

あなたはもうすぐそこにいます！

それ以外の

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

あなたが必要

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

更新された jsFiddleを参照してください

于 2013-03-28T22:49:42.417 に答える