var canvas:BitmapData = new BitmapData(400,400,false, 0x000000);
addChild(new Bitmap(canvas));
// create some draggable dots
var p0:Sprite = dot(100, 100);
var p1:Sprite = dot(200, 200);
var m0:Sprite = dot(200, 100, 0xFFFFFF, 3)
var m1:Sprite = dot(100, 200, 0xFFFFFF, 3);
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
canvas.fillRect(canvas.rect, 0x000000);
var px:Number = 0;
var py:Number = 0;
for (var t:Number = 0; t <1; t+=.01){
var t_2:Number = t * t;
var t_3:Number = t_2 * t;
// some repetitive math for clarity
px = (2 * t_3 - 3 * t_2 + 1) * p0.x +(t_3 - 2 * t_2 + t) *
m0.x + (-2 * t_3 + 3 * t_2) * p1.x + (t_3 - t_2) * m1.x;
py = (2 * t_3 - 3 * t_2 + 1) * p0.y +(t_3 - 2 * t_2 + t) *
m0.y + (-2 * t_3 + 3 * t_2) * p1.y + (t_3 - t_2) * m1.y;
canvas.setPixel(px, py, 0xFF0000);
}
}
// draggable dot
function dot(xp:Number, yp:Number, col:uint = 0x507399, rad:Number=5):Sprite {
var s:Sprite = Sprite(addChild(new Sprite()));
s.x = xp;
s.y = yp;
with(s.graphics) beginFill(col), drawCircle(0,0,rad);
s.buttonMode = true;
s.addEventListener(MouseEvent.MOUSE_DOWN, onDrag);
return s;
}
function onDrag(evt:MouseEvent):void {
evt.currentTarget.startDrag()
}
stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
function onUp(evt:MouseEvent):void{
stopDrag();
}
This is the start of my exploration of Cubic Hermite Splines (like Catmull–Rom)… I wrote this snippet while skimming the wikipedia article on the subject…. at first I wasn’t sure if this was correct, but I added tangent calculations for a Catmull-Rom and it worked nicely… will post that tomorrow.