小编Sup*_*bot的帖子

(我是Javascript/HTML/CSS编码的新手,请原谅我糟糕的风格!)

我想以静态速度沿着该数组中的一组坐标为数组中的对象设置动画:

数组示例:

_myPtArr = [{x:297, y:30},{x:299,y:47},{x:350,y:56},{x:305,y:176},{x:278,y:169},
{x:303,y:108},{x:269,y:79},{x:182,y:90},{x:137,y:81},{x:173,y:33},{x:231,y:38}];

我做的是做什么的; 创建一个在程序开头运行的函数,以接收任何数组,并将距离属性(名为"dis")添加到它计算距离的两个点中的第一个,如下所示:

function findDist(array) {
    for (var i = 0; i<array.length-1;i++){
        var p = array[i],
            q = array[i+1],
            dx   = p.x - q.x,         
            dy   = p.y - q.y,         
            dist = Math.sqrt(dx*dx + dy*dy);
            array[i].dis=dist;
    }
}

我这样做是因为我动画它们的方式是创建一个名为"_tick"的变量,它将它们从一个点移动到另一个点,从0到1递增,0是起点,1是结束点.我打算将滴答倍数乘以距离,以便不同的线长度以相同的速度生成动画.但我没有得到这样的工作!我被卡住了!这是我刚刚谈到的函数/ s:

function calculateInnerPts(pts, pos){
        var ptArr = [];
        console.log(pts.length);
        for(var i = 0; i < pts.length-1; i++){
           ptArr[i] = {x: pts[i].x + (pts[i+1].x - pts[i].x) * pos, y: pts[i].y + 
         (pts[i+1].y - pts[i].y) * pos}; …