Createjs и easlejs - оживить линию с несколькими точками

Question

Я хотел бы обойти линию, которая имеет более двух точек. Пример из двух точек можно найти здесь - https://jsfiddle.net/gskinner/17Lk8a9s/1/

Однако, у меня есть массив путей

 var path = [0,0,0,100,200,200]; 

Как промежуточные кадры этой линии по массиву с createJS/tweenJS?

Answer 1

Вам просто нужно оживить каждую точку отдельно.

Вот краткий пример: http://jsfiddle.net/lannymcnie/zd1amd3k/

Он просто имеет цикл для анимировать каждую точку отдельно:

for (var i=0, l=pathStart.length; i<l; i+=2) { 
    var cmd = shape.commands[i] = (i == 0) 
    ? g.moveTo(pathStart[i], pathStart[i+1]).command 
    : g.lineTo(pathStart[i], pathStart[i+1]).command; 

    var duration = Math.random() * 2000 + 1000; 

    createjs.Tween.get(cmd, {loop:true}) 
    .to({x:pathEnd[i], y:pathEnd[i+1]}, duration, createjs.Ease.quadIn) 
    .to({x:pathStart[i], y:pathStart[i+1]}, duration, createjs.Ease.quadOut); 
} 

Надежда, что помогает.