Category Archives: bezier

setPixel() Cubic Bezier

Actionscript:
  1. var canvas:BitmapData=new BitmapData(280,280,false,0x000000);
  2. addChild(new Bitmap(canvas, PixelSnapping.AUTO, true));
  3.  
  4. var color:uint;
  5.  
  6. // anchor x1, anchor y1,
  7. // control-handle x2, control-handle y2,
  8. // anchor x3, anchor y3, control-handle x4,
  9. // control-handle y4, [resolution incremental value between 0-1]
  10. function cubicBezier(x1:Number, y1:Number, x2:Number, y2:Number,
  11.                           x3:Number, y3:Number, x4:Number, y4:Number, resolution:Number=.03):void {
  12.    
  13.     var b:Number,pre1:Number,pre2:Number,pre3:Number,pre4:Number;
  14.     for (var a = 0; a <1; a+=resolution) {
  15.         b=1-a;
  16.         pre1=(a*a*a);
  17.         pre2=3*(a*a)*b;
  18.         pre3=3*a*(b*b);
  19.         pre4=(b*b*b);
  20.         canvas.setPixel(pre1*x1 + pre2*x2 + pre3*x4 + pre4*x3 ,
  21.                          pre1*y1 + pre2*y2 + pre3*y4 + pre4*y3, color);
  22.     }
  23. }
  24.  
  25. // draw a few
  26.  
  27. color = 0xFFFFFF;
  28.  
  29. cubicBezier(100,100,
  30.                     150, 50,
  31.                     200, 100,
  32.                     150, 150);
  33.  
  34. color = 0xFF0000;
  35.  
  36. cubicBezier(10,10,
  37.                     150, 10,
  38.                     200, 200,
  39.                     250, 150,
  40.                 .01);
  41. /*
  42. WARNING: This code was written for fun. Use at your own risk.
  43. */

This draws cubic bezier curves with setPixel. I'm pretty sure I picked up the original math from somewhere on the processing forums in '03 or '04...

Also posted in BitmapData, setPixel | Tagged | Leave a comment