Mathographic Eggs

Lee Brimelow mentioned recently that he had picked up this book while in Singapore.

It looked pretty interesting, so I grabbed it off Amazon, and it does have some cool concepts in there. For me, it seems just about the right balance of explanation and open-endedness. It gives you some concepts and a gentle nudge and you’re left to explore on your own.

Chapter one is on egg drawing. Gives you some tips on joining arcs and some diagrams on how you might make a smooth egg. The chapter is geared towards ruler and compass drawing (later chapters are geared more towards computer graphics), but it was easy enough to take some of the concepts and apply them to some AS3 code. I made a very simple egg drawing routine. Far simpler than some of the diagrams shown anyway.

[kml_flashembed movie=”http://www.bit-101.com/blog/wp-content/uploads/2008/11/egg.swf” height=”400″ width=”400″ /]

[as][SWF(backgroundColor=0xffcccc)]

var n:Number = 0;
var a:Number;
addEventListener(Event.ENTER_FRAME, enterFrameHandler);
function enterFrameHandler(event:Event):void
{
n += .1;
a = .5 + Math.sin(n) * .5
graphics.clear();
drawEgg();
}

function drawEgg():void
{
graphics.beginFill(0xccccff);
graphics.lineStyle(0, 0, .5);
graphics.moveTo(300, 250);
drawArc(graphics, 200, 250, 100, 0, Math.PI);
drawArc(graphics, 300, 250, 200, Math.PI, Math.PI + a);
var radius:Number = 100 / Math.cos(-a);
var ypos:Number = 250 + Math.sin(-a) * radius;
drawArc(graphics, 200, ypos, 200 – radius, -Math.PI + a, -a);
drawArc(graphics, 100, 250, 200, -a, 0);
graphics.endFill();
}

function drawArc(graphics:Graphics, xpos:Number, ypos:Number, radius:Number, start:Number, end:Number, segments:int = 100):void
{
// graphics.moveTo(xpos + Math.cos(start) * radius, ypos + Math.sin(start) * radius);
if(start – end < 0) { for(var i:Number = start; i < end; i += (end - start) / segments) { graphics.lineTo(xpos + Math.cos(i) * radius, ypos + Math.sin(i) * radius); } } else { for(i = start; i > end; i += (end – start) / segments)
{
graphics.lineTo(xpos + Math.cos(i) * radius, ypos + Math.sin(i) * radius);
}
}
graphics.lineTo(xpos + Math.cos(end) * radius, ypos + Math.sin(end) * radius);
}[/as]

This entry was posted in ActionScript, Flash. Bookmark the permalink.

Leave a Reply