Tag Archives: as3

3D Bezier

By Zevan | August 22, 2009

Actionscript:

[SWF(backgroundColor=0x000000, width=800, height=600)];
x = stage.stageWidth / 2;
y = stage.stageHeight / 2;
var verts:Vector.<Number>  = new Vector.<Number>();
var tVerts:Vector.<Number> = new Vector.<Number>();
var pVerts:Vector.<Number> = new Vector.<Number>();
var uvts:Vector.<Number> = new Vector.<Number>();
 
var igraph:Vector.<IGraphicsData> = new Vector.<IGraphicsData>();
 
var tVect:Vector3D = new Vector3D();
var m:Matrix3D = new Matrix3D();
for (var i:int = 0; i<300; i++){
    for (var j:int = 0; j<3; j++){
        tVect.x = Math.random() * 0.15;
        m.identity();
        m.appendRotation(Math.random()*360, Vector3D.X_AXIS);
        m.appendRotation(Math.random()*360, Vector3D.Y_AXIS);
        m.appendRotation(Math.random()*360, Vector3D.Z_AXIS);
        tVect = m.transformVector(tVect);
        verts.push(tVect.x, tVect.y, tVect.z);
    }
    
     
    var stroke:IGraphicsData = new GraphicsStroke();
    
    var col:int = [0xFFFFFF, 0x000000, 0xFFCC00, 0xFF0000][int(Math.random() * 4)];
    with (stroke) thickness = (Math.random()*Math.random())*10, fill = new GraphicsSolidFill(col);
 
    var bez:GraphicsPath = new GraphicsPath();
    bez.commands = Vector.<int>([1, 3]);
    igraph.push(stroke);
    igraph.push(bez);
}
 
var perspective:PerspectiveProjection = new PerspectiveProjection();
perspective.fieldOfView = 45;
var trans:Matrix3D = new Matrix3D();
var proj:Matrix3D = perspective.toMatrix3D();
var dx:Number = 0, dy:Number = 0;
 
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
    dx += (mouseX - dx) / 4;
    dy += (mouseY - dy) / 4;
       
    trans.identity();
    trans.appendRotation(dy, Vector3D.X_AXIS);
    trans.appendRotation(dx, Vector3D.Y_AXIS);
    trans.appendTranslation(0,0,0.5);
    trans.transformVectors(verts, tVerts);
    Utils3D.projectVectors(proj, tVerts, pVerts, uvts);
    
    var inc:int = 0;
    for (var i:int = 1; i<igraph.length; i+=2){
        GraphicsPath(igraph[i]).data = pVerts.slice(inc, inc + 6);
        inc += 6;
    }
     
    graphics.clear();
    graphics.drawGraphicsData(igraph);
}

After a few hours of trying to get a super optimized fp10 z-sorting demo happening, I gave up (for now) and decided to just let loose with something easy. The result is this 3D Bezier example...

Check out the swf...

Posted in 3D, Graphics, bezier | Also tagged actionscript, flash, fp10 | 3 Comments

Sierpiński Glitch Texture #3

By Zevan | August 21, 2009

CLICK HERE TO COPY

Actionscript:

[SWF(frameRate=60, backgroundColor=0x000000, width=500, height=500)]
 
var canvas:BitmapData = new BitmapData(500,500,false, 0x000000);
addChild(new Bitmap(canvas));
var clone:BitmapData = new BitmapData(500,500,false, 0x000000);
var canvasRect:Rectangle = canvas.rect;
var w:int = canvas.width;
var w2:Number = 1/w;
var w10:Number = 1/(w * 80);
var convert:Number = Math.PI/180;
var size:int = canvas.width * canvas.height;
var pix:Vector.<uint> = new Vector.<uint>(size, true);
var m:Matrix = new Matrix();
m.scale(1,-1);
m.translate(0,canvas.height);
var sin:Number = 0, cos:Number = 0;
var dx:Number = 0, dy:Number = 0;
var pnt:Point = new Point();
var blur:BlurFilter = new BlurFilter(10,10,1);
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
    canvas.lock();
    dx +=  (mouseX * 10 - 3000 - dx) / 8;
    dy +=  (mouseY * 4 - dy) / 8;
    for (var i:int = 0; i<size; i++){
        var xp:int = i % w;
        var yp:int = int(i * w2);
        var xp2:int = xp <<1;
        var t:Number;
        t = ((yp|(xp + yp * 0.1)) * (xp + dx) *w10) % 6.14687;
        //compute sine
        // technique from http://lab.polygonal.de/2007/07/18/fast-and-accurate-sinecosine-approximation/
        // by Michael Baczynski
        if (t<0) {
            sin=1.27323954*t+.405284735*t*t;
        } else {
            sin=1.27323954*t-0.405284735*t*t;
        }
        // compute cosine
        t = (xp2|(yp+xp*0.1) + dy) * convert % 6.28;
        t+=1.57079632;
        if (t>3.14159265) {
            t-=6.28318531;
        }
        if (t<0) {
            cos=1.27323954*t+0.405284735*t*t;
        } else {
            cos=1.27323954*t-0.405284735*t*t;
        }
        var c1:int = 31 * (sin - cos);
        if (c1 <0) c1 = 256 - c1;
        c1 = (c1 <<4 | c1) ;
        pix[i] = c1 <<16 | c1 <<8 | c1;
    }
    canvas.setVector(canvasRect, pix);
    clone.copyPixels(canvas, canvasRect, pnt);
    canvas.draw(clone, m, null, BlendMode.SUBTRACT);
    clone.copyPixels(canvas, canvasRect, pnt);
    clone.applyFilter(clone, canvasRect, pnt, blur);
    canvas.draw(clone, null, null, BlendMode.SCREEN);
    canvas.unlock();
}

Decided to do a grayscale version ... also rendered it out large and posted it on flickr...

Check out the swf...

Check out the large flickr version...

Posted in BitmapData, Operators, Vector, pixel manipulation | Also tagged actionscript, flash | 2 Comments

Sierpiński Glitch Texture #2

By Zevan | August 20, 2009

CLICK HERE TO COPY

Actionscript:

[SWF(frameRate=60, backgroundColor=0x000000, width=500, height=500)]
var canvas:BitmapData = new BitmapData(500,500,false, 0x000000);
addChild(new Bitmap(canvas));
var clone:BitmapData = new BitmapData(500,500,false, 0x000000);
var canvasRect:Rectangle = canvas.rect;
var w:int = canvas.width;
var w2:Number = 1/w;
var w10:Number = 1/(w * 80);
var convert:Number = Math.PI/180;
var size:int = canvas.width * canvas.height;
var pix:Vector.<uint> = new Vector.<uint>(size, true);
var gray:ColorMatrixFilter = new ColorMatrixFilter([1, 0.55, 0.55, 0,0,0.55, 0.9, 0.55, 0,0,0.55, 0.55, 0.550,0, 0,0,0,1,0]);
var m:Matrix = new Matrix();
m.scale(1,-1);
m.translate(0,canvas.height);
var sin:Number = 0, cos:Number = 0;
var dx:Number = 0, dy:Number = 0;
var pnt:Point = new Point();
var blur:BlurFilter = new BlurFilter(10,10,1);
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
    canvas.lock();
    dx += (mouseX * 10 - 3000 - dx) / 8;
    dy += (mouseY * 4 - dy) / 8;
    for (var i:int = 0; i<size; i++){
        var xp:int = i % w;
        var yp:int = int(i * w2);
        var xp2:int = xp <<1;
        var t:Number;
        t = ((yp|(xp + yp)) * (xp + dx) *w10) % 6.14687;
        //compute sine
        // technique from http://lab.polygonal.de/2007/07/18/fast-and-accurate-sinecosine-approximation/
        // by Michael Baczynski
        if (t<0) {
            sin=1.27323954*t+.405284735*t*t;
        } else {
            sin=1.27323954*t-0.405284735*t*t;
        }
        // compute cosine
        t = (xp2|(yp+xp/dx) + dy) * convert % 6.28;
        t+=1.57079632;
        if (t>3.14159265) {
            t-=6.28318531;
        }
        if (t<0) {
            cos=1.27323954*t+0.405284735*t*t;
        } else {
            cos=1.27323954*t-0.405284735*t*t;
        }
        var c1:int = 31 * (sin - cos);
        if (c1 <0) c1 = 256 - c1;
        c1 = (c1>>1  | c1) ;
        pix[i] = c1 <<17 | c1 <<8 | c1;
    }
    canvas.setVector(canvasRect, pix);
    clone.copyPixels(canvas, canvasRect, pnt);
    canvas.draw(clone, m, null, BlendMode.SUBTRACT);
    clone.copyPixels(canvas, canvasRect, pnt);
    clone.applyFilter(clone, canvasRect, pnt, blur);
    
    canvas.draw(clone, null, null, BlendMode.LIGHTEN);
    canvas.applyFilter(canvas, canvasRect, pnt, gray);
    canvas.unlock();
}

More texture experimentation...

Have a look at the swf over at wonderfl.net...

Posted in BitmapData, Operators, Vector, pixel manipulation | Also tagged actionscript, flash | Leave a comment

Sierpiński Glitch Texture #1

By Zevan | August 19, 2009

CLICK HERE TO COPY

Actionscript:

[SWF(frameRate=60, backgroundColor=0x000000, width=500, height=500)]
var canvas:BitmapData = new BitmapData(500,500,false, 0x000000);
addChild(new Bitmap(canvas));
var clone:BitmapData = new BitmapData(500,500,false, 0x000000);
var canvasRect:Rectangle = canvas.rect;
var w:int = canvas.width;
var w2:Number = 1/w;
var w10:Number = 1/(w * 80);
var convert:Number = Math.PI/180;
var size:int = canvas.width * canvas.height;
var pix:Vector.<uint> = new Vector.<uint>(size, true);
var gray:ColorMatrixFilter = new ColorMatrixFilter([1, 0.55, 0.55, 0,0,0.55, 0.9, 0.55, 0,0,0.55, 0.55, 0.550,0, 0,0,0,1,0]);
var m:Matrix = new Matrix();
m.scale(1,-1);
m.translate(0,canvas.height);
var sin:Number = 0, cos:Number = 0;
var dx:Number = 0, dy:Number = 0;
var pnt:Point = new Point();
var blur:BlurFilter = new BlurFilter(10,10,1);
addEventListener(Event.ENTER_FRAME, onLoop);
function onLoop(evt:Event):void {
    canvas.lock();
    dx += (mouseX * 10 - 3000 - dx) / 8;
    dy += (mouseY * 4 - dy) / 8;
    for (var i:int = 0; i<size; i++){
        var xp:int = i % w;
        var yp:int = int(i * w2);
        var xp2:int = xp <<1;
        var t:Number;
        t = ((yp|xp) * (xp + dx) *w10) % 6.14687;
        
        //compute sine
        // technique from http://lab.polygonal.de/2007/07/18/fast-and-accurate-sinecosine-approximation/
        // by Michael Baczynski
        if (t<0) {
            sin=1.27323954*t+.405284735*t*t;
        } else {
            sin=1.27323954*t-0.405284735*t*t;
        }
        // compute cosine
        t = (xp2 + dy) * convert % 6.28;
        t+=1.57079632;
        if (t>3.14159265) {
            t-=6.28318531;
        }
        if (t<0) {
            cos=1.27323954*t+0.405284735*t*t;
        } else {
            cos=1.27323954*t-0.405284735*t*t;
        }
        var c1:int = 31 * (sin - cos);
        if (c1 <0) c1 = 256 - c1;
        c1 = (c1 <<3 | c1) ;
        pix[i] = c1 <<15 | c1 <<8 | c1;
    }
    canvas.setVector(canvasRect, pix);
    clone.copyPixels(canvas, canvasRect, pnt);
    canvas.draw(clone, m, null, BlendMode.SUBTRACT);
    clone.copyPixels(canvas, canvasRect, pnt);
    clone.applyFilter(clone, canvasRect, pnt, blur);
    canvas.draw(clone, null, null, BlendMode.ADD);
    canvas.unlock();
}

More strange real-time texture generation. This one is particularly glitchy looking with hints of Sierpiński.

Check out the swf at wonderfl.net...

Posted in Uncategorized | Also tagged actionscript, flash | 4 Comments

Tag Archives: as3

3D Bezier

Sierpiński Glitch Texture #3

Sierpiński Glitch Texture #2

Sierpiński Glitch Texture #1

Search

Pages

Recent Posts

Categories

Archives

RSS Feeds