铰接式动画

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链接。