Monthly Archives: March 2009

Closed Catmull-Rom

Actionscript:
  1. var canvas:BitmapData = new BitmapData(400,400,false, 0x000000);
  2. addChild(new Bitmap(canvas));
  3.  
  4. var pnts:Array = new Array();
  5. // make control points
  6. for (var i:int = 0; i<5; i++){
  7.     var t:Number = i * 72 * Math.PI /180;
  8.     pnts.push(dot(200 + 100 * Math.cos(t),200 +100 * Math.sin(t)));  
  9. }
  10.  
  11. addEventListener(Event.ENTER_FRAME, onLoop);
  12. function onLoop(evt:Event):void {
  13.     canvas.lock();
  14.     canvas.fillRect(canvas.rect, 0x000000);
  15.     curve(pnts);
  16.     canvas.unlock();
  17. }
  18.  
  19. function tangent(pk1:Sprite, pk_1:Sprite){
  20.     return new Point((pk1.x - pk_1.x) / 2, (pk1.y - pk_1.y) / 2);
  21. }
  22.  
  23. // all math from http://en.wikipedia.org/wiki/Cubic_Hermite_spline
  24. function curve(p:Array, res:Number=.03):void{
  25.     var px:Number = 0;
  26.     var py:Number = 0;
  27.     var pIter:int = p.length - 1;
  28.     var m:Array = [];
  29.    
  30.     m[0] = tangent(p[1] ,  p[pIter]);
  31.     for (var i:int = 1; i<pIter; i++){
  32.         m[i] = tangent(p[i + 1], p[i - 1]);
  33.     }
  34.     m[pIter] = tangent(p[0],p[pIter-1]);
  35.    
  36.     for (var t:Number = 0; t <1; t+=res){
  37.          var t_2:Number = t * t;
  38.          var _1_t:Number = 1 - t;
  39.          var _2t:Number = 2 * t;
  40.          
  41.          var h00:Number =  (1 + _2t) * (_1_t) * (_1_t);
  42.          var h10:Number =  t  * (_1_t) * (_1_t);
  43.          var h01:Number =  t_2 * (3 - _2t);
  44.          var h11:Number =  t_2 * (t - 1);
  45.          
  46.          for (var k:int = 0; k <pIter; k++){
  47.              var k1:int = k + 1;
  48.              var pk:Sprite = p[k];
  49.              var pk1:Sprite = p[k1];
  50.              var mk:Point = m[k];
  51.              var mk1:Point = m[k1];
  52.              px = h00 * pk.x + h10 * mk.x + h01 * pk1.x + h11 * mk1.x;
  53.              py = h00 * pk.y + h10 * mk.y + h01 * pk1.y + h11 * mk1.y;
  54.              canvas.setPixel(px, py, 0xFFFFFF);
  55.          }
  56.           pk = p[k];
  57.           pk1 = p[0];
  58.           mk = m[k];
  59.           mk1= m[0];
  60.          
  61.           px = h00 * pk.x + h10 * mk.x + h01 * pk1.x + h11 * mk1.x;
  62.           py = h00 * pk.y + h10 * mk.y + h01 * pk1.y + h11 * mk1.y;
  63.           canvas.setPixel(px, py, 0xFFFFFF);
  64.     }
  65. }
  66.  
  67. // draggable dot
  68. function dot(xp:Number, yp:Number, col:uint = 0xFF0000, rad:Number=4):Sprite {
  69.     var s:Sprite = Sprite(addChild(new Sprite));
  70.     s.x = xp;
  71.     s.y = yp;
  72.     with(s.graphics) beginFill(col), drawCircle(0,0,rad);
  73.     s.buttonMode = true;
  74.     s.addEventListener(MouseEvent.MOUSE_DOWN, onDrag);
  75.     return s;
  76. }
  77. function onDrag(evt:MouseEvent):void {
  78.     evt.currentTarget.startDrag()
  79. }
  80. stage.addEventListener(MouseEvent.MOUSE_UP, onUp);
  81. function onUp(evt:MouseEvent):void{
  82.     stopDrag();
  83. }

This a variation on a post from a few days ago. This shows how to create a closed Catmull Rom spline.

See the other Catmull-Rom related Posts

Posted in Math, graphics algorithms, setPixel | Tagged , | 2 Comments

Hippopede

Actionscript:
  1. x=stage.stageWidth/2;
  2. y=stage.stageHeight/2;
  3. var xp:Number = 0, yp:Number = 0;
  4. var r:Number = 0, t:Number = 0;
  5. var speed:Number=.1;
  6.  
  7. var range:Number=.2;
  8. var b:Number = 20;
  9. var a:Number = b * range;
  10. var orbit:Number = 2 * Math.PI + speed;
  11.  
  12. graphics.lineStyle(0,0x000000);
  13.  
  14. addEventListener(Event.ENTER_FRAME, onLoop);
  15. function onLoop(evt:Event):void {
  16.     var sin:Number=Math.sin(t);
  17.     r =  Math.sqrt(4 * b * (a - b * (sin * sin)));
  18.     xp= r * Math.cos(t);
  19.     yp= r * sin;
  20.    
  21.     if (t==0) {
  22.         graphics.moveTo(xp, yp);
  23.     } else {
  24.         graphics.lineTo(xp, yp);
  25.     }
  26.  
  27.     t += speed;
  28.    
  29.     if (t> orbit) {
  30.         range += .5;
  31.         a= b * range;
  32.         t= 0;
  33.     }
  34. }

The above draws a Hippopede

Posted in Graphics, Math, motion | Tagged , | Leave a comment

Fermat’s Spiral

Actionscript:
  1. x = stage.stageWidth / 2;
  2. y = stage.stageHeight / 2;
  3.  
  4. var xp:Number = 0, yp:Number = 0;
  5. var r:Number = 0, t:Number = 0;
  6. var speed:Number = .07;
  7. var scale:Number = 20;
  8.  
  9. var plot0:Shape = Shape(addChild(new Shape()));
  10. var plot1:Shape = Shape(addChild(new Shape()));
  11. plot0.graphics.lineStyle(0,0x000000);
  12. plot1.graphics.lineStyle(0,0x000000);
  13.  
  14. addEventListener(Event.ENTER_FRAME, onLoop);
  15. function onLoop(evt:Event):void {
  16.      r =  scale * Math.sqrt(t);
  17.      xp =  r * Math.cos(t);
  18.      yp =  r * Math.sin(t);
  19.      t += speed;
  20.      
  21.     plot0.graphics.lineTo(xp, yp);
  22.     plot1.graphics.lineTo(-xp, -yp);
  23. }

This snippet draws Fermat's Spiral.

Posted in Graphics, Math, motion | Tagged , | Leave a comment

var obj:Object = new Function()

Actionscript:
  1. var Pnt:Function = function(xp:Number, yp:Number){
  2.    
  3.     var x:Number = xp;
  4.     var y:Number = yp
  5.    
  6.     this.setX = function(v:int):void{
  7.         x = v;
  8.     }
  9.     this.setY = function(v:int):void{
  10.         y = v;
  11.     }
  12.     this.getX = function():int {
  13.         return x;
  14.     }
  15.     this.getY = function():int {
  16.         return y;
  17.     }
  18. }
  19.  
  20. var p:Object = new Pnt(10,10);
  21.  
  22. trace(p.getX(), p.getY());
  23. p.setX(100);
  24. trace(p.getX());
  25.  
  26. /*
  27. outputs:
  28. 10, 10
  29. 100
  30. */

Another way to define and instantiate Objects on the timeline. Interesting, but I don't recommend it over actual classes...

Posted in OOP, Object, functions | Tagged , | Leave a comment