Creating Beautiful Shapes using As3 Graphics Api

I always like fancy graphics stuff that just works. Creating graphics using Code and Mathematics was one of them. One day, while trying to create some wobbly circle using Sin and cos inside For loops, i accidentally stumbled across various beautiful shapes, just by varying values of some variables only. It was pretty Cool, to create (or just see it being created) and i recreated it on moving onto various languages, and now i decided to release a tutorial on how to create interesting shapes with AS3 Graphics Api.

First, Lets see the Demo (Click on the Image). Try it with various Values.

As3 Graphics Demo

Click to See the Demo

GUI Elements courtesy of Minimal Comps library by Keith peters.

The working is quite simple. Just a line of code.

Considering the center coordinates as x & y, increasing angle as Angle, for every loop or step of time, and radius as deviation from center, do

drawingSprite.graphics.lineTo(x+radius*Math.sin(a1*Angle),y+radius*Math.cos(a2*Angle)); // For Mode 1, simple shapes

ie. if a1 =1 & a2 =1, we get a circle.

For Mode 2 we mutiply each coordinates with another Cos and Sin with coefficients a3 and a4.

ie . drawingSprite.graphics.lineTo(x+radius*Math.sin(a1*Angle)*Math.cos(a3*Angle),y+radius*Math.cos(a2*Angle)*Math.sin(a4*Angle)); // For Mode 2, Complex Beautiful shapes.

And here’s the Full Source code, if you like. If you want to test without minimal Comps, just Comment those stuff and change values and compile it.

[expand title=”Show Code” swaptitle=”Hide Code”]

[snippet id=”402″]

[/expand]

Send in your comments and suggestions & feel free to share your thoughts.

You may also like...

Leave a Reply

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