放慢動畫補間

Question

我創建了一個將圖形添加到畫布舞台並通過補間動畫的函數，等待幾毫秒然后生成另一個

在某些幫助下，我可以做一些事情，

首先，在資產以正常速度播放幾秒鍾后，我需要將資產放慢至停止狀態（我正在對路中間的線進行動畫處理）

其次，當動畫開始時，屏幕上沒有任何內容，因為它們正在標記開始時必須顯示的內容

以及完成動畫后如何刪除每個項目的任何想法

這是我到目前為止的

    //this is called from the tick handler
    function lines(){
    duration = 1000;
    spawnCounter--;
    console.log(spawnCounter)
    if(spawnCounter == 0){
    spawnCounter = sNum//20
    bolt = new lib.Bolt();
    bolt.x=280
    bolt.y = 120;
    bolt.rotation = -66;
    stage.addChild(bolt);
    createjs.Tween.get(bolt).to({x:0,y:0, scaleY:.6, scaleX:.6},duration)

            }
        }

Answer 1

在補間結束時刪除項目非常簡單：

createjs.Tween.get(bolt)
    .to({x:0,y:0, scaleY:.6, scaleX:.6}, duration)
    .call(function(event) {
        stage.removeChild(bolt);
    });

以制作動畫的方式放慢整個動畫的過程可能會比較棘手，因為您可能希望素材資源以相同的速度放慢速度，因此不能僅更改補間的持續時間。 您可能要考慮不對動畫使用補間，而是只控制刻度線中的“可見”項，並在它們太遠時將其刪除。

我創建了一個快速示例，展示了它如何工作。 http://jsfiddle.net/wj15awj4/

• 經過一定的“距離”后生成項目
• 移除邊緣上方的物品
• 根據位置縮放和Alpha項目。 規模有點奇怪，因為這條路沒有視野。 使用CSS或WebGL轉換畫布可以更好地解決這一問題。

單擊道路時，將“補間”（或補回）“速度”，並且由於根據經過的“距離”創建了項目，因此盡管移動速度較慢，但​​它們將繼續以大致相同的速度創建隨着時間的推移。

希望這可以幫助！