Catmull-Rom Error

I was messing with Catumull Rom spline code from awhile back and this this came out:

[SWF(width = 500, height= 500)]
var pnts:Array = new Array();
// make 8 control points
for (var i:int = 0; i<8; i++){
    pnts.push(dot(50 + Math.random() * 80 * i, Math.random()*(stage.stageHeight-40)+20));
}
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
    
    graphics.clear();
    graphics.lineStyle(0,0);
    curve(pnts); 
}
function tangent(pk1:Sprite, pk_1:Sprite){
    return new Point((pk1.x - pk_1.x) / 2, (pk1.y - pk_1.y) / 2);
}
// all math from http://en.wikipedia.org/wiki/Cubic_Hermite_spline
function curve(p:Array, res:Number=.05):void{
    var px:Number = 0;
    var py:Number = 0;
    var pIter:int = p.length - 1;
    var m:Array = [];
    m[0] = tangent(p[1], p[0]);
    for (var i:int = 1; i<pIter; i++){
        m[i] = tangent(p[i + 1], p[i - 1]);
    }
    m[pIter] = tangent(p[pIter], p[pIter - 1]);
    for (var t:Number = 0; t <1; t+=res){
         var t_2:Number = t * t;
         var _1_t:Number = 1 - t;
         var _2t:Number = 2 * t;
         var h00:Number =  (1 + _2t) * (_1_t) * (_1_t);
         var h10:Number =  t  * (_1_t) * (_1_t);
         var h01:Number =  t_2 * (3 - _2t);
         var h11:Number =  t_2 * (t - 1);
         for (var k:int = 0; k <pIter; k++){
             var k1:int = k + 1;
             var pk:Sprite = p[k];
             var pk1:Sprite = p[k1];
             var mk:Point = m[k];
             var mk1:Point = m[k1];
            
             px = h00 * pk.x + h10 * mk.x + h01 * pk1.x + h11 * mk1.x;
             py = h00 * pk.y + h10 * mk.y + h01 * pk1.y + h11 * mk1.y;
             if (k == 0){
				graphics.moveTo(px, py); 
			 }else{
				graphics.lineTo(px, py);
			 }
			 
            // canvas.setPixel(px, py, 0xFFFFFF);
         }
    }
}
// draggable dot
function dot(xp:Number, yp:Number, col:uint = 0xFF0000, rad:Number=4):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);
stage.addEventListener(MouseEvent.MOUSE_DOWN,onDown);
function onDown(evt:MouseEvent):void{
      dotsVisible(false);
}
function onUp(evt:MouseEvent):void{
    stopDrag();
    dotsVisible(true);
}

function dotsVisible(bool:Boolean):void{
	for (var i:int = 0; i<pnts.length; i++){
      pnts[i].visible = bool;
     }
}


You can see the swf over at wonderfl.

4 comments

Leave a Reply

Your email address will not be published. Required fields are marked *