前回の第23回
弾みのついた軌跡を描く
マウスポインタの動きに少し遅れて，
第23回コード2
var lastMidPoint = new createjs.Point();
var currentPoint = new createjs.Point();
var lastPoint = new createjs.Point();
var velocityX = 0;
var velocityY = 0;
var ease = 0.25;
var friction = 0.75;
function draw() {
var moveX = (stage.mouseX - currentPoint.x);
var moveY = (stage.mouseY - currentPoint.y);
if (moveX * moveX + moveY * moveY > 0.1) {
// velocityX = moveX * ease;
// velocityY = moveY * ease;
velocityX += moveX * ease;
velocityY += moveY * ease;
velocityX *= friction;
velocityY *= friction;
currentPoint.x += velocityX;
currentPoint.y += velocityY;
var midPoint = new createjs.Point((lastPoint.x + currentPoint.x) / 2, (lastPoint.y + currentPoint.y) / 2);
var myShape = getNewChild();
container.addChild(myShape);
drawCurve(myShape.graphics, lastMidPoint, midPoint, lastPoint);
lastPoint.initialize(currentPoint.x, currentPoint.y);
lastMidPoint.initialize(midPoint.x, midPoint.y);
}
stage.update();
}
第23回コード2で，
図1 動きが遅くなりながら目標に近づく
それに対して，
図2 目標を通り過ぎては戻るバネのような動き
