I am trying to figure out how to sequence the train animation so I can offset and rotate each wagon in turn around curves. I am developing it using KineticJS in 2d with the intention of using the same data and functionality via an .rb bridge to make a more dramatic display in Sketchup.

If you have Chrome or another fully HTML5 compatible browser you can see on  Route_51 all the wagons follow the black loco at the same time. I just cannot figure out yet how to create the stagger.  Here is a zoom screenshot to show the situation:

Here is my code for running the straight sections:
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();
}
I don't seem to be able to grasp the logic (getting too old).
Any help appreciated. Thanks.