在rapheljs中用尾部移动指针，

Question

我将创建一条曲线，其中白色指针缓慢移动，该指针具有从不透明度1到0的长尾框。Here是一个没有动画指针的小提琴。我试图移动指针尾的那些盒子，但他们正在失去距离。 Here是我为动画制作的另一个步骤。如何在不丢失指针的原创性的情况下制作动画，如第一小提琴链接？

这是动画代码我做了什么

    var paper = Raphael(0,0, 1300,700);
var p=paper.path('M27,443Q159,708,342,370,500,60,640,370,800,700,940,445')
.attr({
    stroke:'#000',
    'stroke-width':10,
});
 Len = p.getTotalLength();
 paper.customAttributes.Along = function (v) {
            var Point = Curve.getPointAtLength(v * Len);

            return {
                transform: "t" + [Point.x, Point.y] + "r" + Point.alpha
            };
        };

var arr=[],i
for(i=0;i<500;i+=12){
    arr.push(
        paper.path(p.getSubpath(i,i+10)).attr({
            stroke:'#FFF',
            'stroke-width':10,
            opacity:(i/800),
            along:0
        }))
}
var x=0;

function move(){
    var tmp;
    for(var d=arr.length-1;d>0;d--){
        if(d==(arr.length-1)){
            tmp=arr[arr.length-1].attr('path').toString();
            arr[arr.length-1].attr({path:p.getSubpath(x,x+5)});
        }
        else if(d==0){
            arr[i]=tmp;
        }            
        else{
            var t=arr[d].attr('path').toString();
            arr[d].attr({
                path:tmp
            });
            tmp=t;
        }
    }

    x++;
    if(x>1200)return;
    setTimeout(move,1)
}


move()