{"id":498,"date":"2010-03-22T06:27:37","date_gmt":"2010-03-22T13:27:37","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=2855"},"modified":"2010-03-22T06:27:37","modified_gmt":"2010-03-22T13:27:37","slug":"catmull-rom-error","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=498","title":{"rendered":"Catmull-Rom Error"},"content":{"rendered":"

I was messing with Catumull Rom spline code from awhile back and this this came out:<\/p>\n

\r\n[SWF(width = 500, height= 500)]\r\nvar pnts:Array = new Array();\r\n\/\/ make 8 control points\r\nfor (var i:int = 0; i<8; i++){\r\n\u00a0 \u00a0 pnts.push(dot(50 + Math.random() * 80 * i, Math.random()*(stage.stageHeight-40)+20));\r\n}\r\naddEventListener(Event.ENTER_FRAME, onLoop);\r\nfunction onLoop(evt:Event):void {\r\n\u00a0 \u00a0 \r\n    graphics.clear();\r\n    graphics.lineStyle(0,0);\r\n\u00a0 \u00a0 curve(pnts); \r\n}\r\nfunction tangent(pk1:Sprite, pk_1:Sprite){\r\n\u00a0 \u00a0 return new Point((pk1.x - pk_1.x) \/ 2, (pk1.y - pk_1.y) \/ 2);\r\n}\r\n\/\/ all math from http:\/\/en.wikipedia.org\/wiki\/Cubic_Hermite_spline\r\nfunction curve(p:Array, res:Number=.05):void{\r\n\u00a0 \u00a0 var px:Number = 0;\r\n\u00a0 \u00a0 var py:Number = 0;\r\n\u00a0 \u00a0 var pIter:int = p.length - 1;\r\n\u00a0 \u00a0 var m:Array = [];\r\n\u00a0 \u00a0 m[0] = tangent(p[1], p[0]);\r\n\u00a0 \u00a0 for (var i:int = 1; i<pIter; i++){\r\n\u00a0 \u00a0 \u00a0 \u00a0 m[i] = tangent(p[i + 1], p[i - 1]);\r\n\u00a0 \u00a0 }\r\n\u00a0 \u00a0 m[pIter] = tangent(p[pIter], p[pIter - 1]);\r\n\u00a0 \u00a0 for (var t:Number = 0; t <1; t+=res){\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var t_2:Number = t * t;\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var _1_t:Number = 1 - t;\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var _2t:Number = 2 * t;\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var h00:Number = \u00a0(1 + _2t) * (_1_t) * (_1_t);\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var h10:Number = \u00a0t \u00a0* (_1_t) * (_1_t);\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var h01:Number = \u00a0t_2 * (3 - _2t);\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0var h11:Number = \u00a0t_2 * (t - 1);\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0for (var k:int = 0; k <pIter; k++){\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0var k1:int = k + 1;\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0var pk:Sprite = p[k];\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0var pk1:Sprite = p[k1];\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0var mk:Point = m[k];\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0var mk1:Point = m[k1];\r\n            \r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0px = h00 * pk.x + h10 * mk.x + h01 * pk1.x + h11 * mk1.x;\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0py = h00 * pk.y + h10 * mk.y + h01 * pk1.y + h11 * mk1.y;\r\n             if (k == 0){\r\n\t\t\t\tgraphics.moveTo(px, py); \r\n\t\t\t }else{\r\n\t\t\t\tgraphics.lineTo(px, py);\r\n\t\t\t }\r\n\t\t\t \r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \/\/\u00a0canvas.setPixel(px, py, 0xFFFFFF);\r\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0}\r\n\u00a0 \u00a0 }\r\n}\r\n\/\/ draggable dot\r\nfunction dot(xp:Number, yp:Number, col:uint = 0xFF0000, rad:Number=4):Sprite {\r\n\u00a0 \u00a0 var s:Sprite = Sprite(addChild(new Sprite));\r\n\u00a0 \u00a0 s.x = xp;\r\n\u00a0 \u00a0 s.y = yp;\r\n\r\n\u00a0 \u00a0 with(s.graphics) beginFill(col), drawCircle(0,0,rad);\r\n\u00a0 \u00a0 s.buttonMode = true;\r\n\u00a0 \u00a0 s.addEventListener(MouseEvent.MOUSE_DOWN, onDrag);\r\n\u00a0 \u00a0 return s;\r\n}\r\nfunction onDrag(evt:MouseEvent):void {\r\n\u00a0 \u00a0 evt.currentTarget.startDrag()\r\n}\r\nstage.addEventListener(MouseEvent.MOUSE_UP, onUp);\r\nstage.addEventListener(MouseEvent.MOUSE_DOWN,onDown);\r\nfunction onDown(evt:MouseEvent):void{\r\n\u00a0 \u00a0   dotsVisible(false);\r\n}\r\nfunction onUp(evt:MouseEvent):void{\r\n\u00a0 \u00a0 stopDrag();\r\n    dotsVisible(true);\r\n}\r\n\r\nfunction dotsVisible(bool:Boolean):void{\r\n\tfor (var i:int = 0; i<pnts.length; i++){\r\n\u00a0 \u00a0   pnts[i].visible = bool;\r\n     }\r\n}\r\n<\/pre>\n

\nYou can see the swf over at wonderfl.
\n<\/p>\n
<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
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++){ \u00a0 \u00a0 pnts.push(dot(50 + Math.random() * 80 * i, Math.random()*(stage.stageHeight-40)+20)); } addEventListener(Event.ENTER_FRAME, onLoop); function onLoop(evt:Event):void { \u00a0 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-498","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/498","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=498"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/498\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=498"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=498"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=498"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}