鉸接式動畫

Question

我想弄清楚如何對火車動畫進行排序，以便我可以在曲線上依次偏移和旋轉每個貨車，例如，在Route_51（單擊測試>運行[兩次]）中輸入this display。需要Chrome或其他符合HTML5的瀏覽器。

這裏是（使用KineticJs）我到目前爲止，「不符合要求的」代碼：

function animate(nr,path,incr,train,dirX,dirY){ 
var steps,offsetX,offsetY,count,a; 
steps = Math.round(path[nr][2]/incr); 
offsetX = path[nr][2]/steps; 
offsetY = path[nr][3]/steps; 
count = 0; 
stage.onFrame(function(frame){ 
    layer = train[0].getLayer(); 
    if(count < steps){ 
     for(a=0; a<train.length; a+=1){ 
      incrX = train[a].getX() + offsetX * -dirX; 
      incrY = train[a].getY() - offsetY * -dirY; 
      train[a].setX(incrX); 
      train[a].setY(incrY); 
     } 
     layer.draw(); 
     count += 1; 
    } 
    else{ 
     stage.stop(); 
     nr += 1; 
     if(path[nr]){ 
      animate(nr,path,incr,train,dirX,dirY); 
     } 
    } 
}); 
stage.start(); 

}

我似乎不能夠把握邏輯（變老）。

所有幫助表示讚賞。謝謝。

Answer 1

在某種邏輯出現之前似乎需要經過一段時間。

在這種情況下，每個旅行車/旅行車都需要自己完全遞增的路徑來啓動，並且可以選擇性地完成交錯。以下是使用「正常」比例視圖插圖運行的火車的屏幕截圖。特別是在曲線座標方面，當然還有改進空間。

爲動畫訪問http://glasier.hk並按照KJS鏈接。