Firstly, I should mention that this post involves some boring, geeky mathematics. Geometry to be precise. In da Vinci’s day, Euclidean geometry was the pinnacle of intellectual pursuit and you will find a great many interesting geometric shapes coded into his artwork. Shapes that now have conspiracy theorists practically frothing in delight.

For most of the drawing in this post I will be using something called “Scalable Vector Graphics” (SVG). You will only be able to see the cool animated images here if your browser supports SVG or you have the Adobe SVG plugin. Firefox supports SVG natively.

As a part of my job, I needed to move… something… around in an elliptical pattern. Well, I didn’t absolutely have to move it in an elliptical pattern, but it would have been cool. I ended up relenting and drawing it simply as a circle, which is not quite as cool.

Tracing a circle is easy. If you put a circle at the origin of an x/y coordinate system, the circumference lies on the corner of a right-angled triangle with the radius of the circle being the hypotenuse of the triangle. This is one of the properties of a circle after all.

My peers in high school would always complain that they would never have to use maths in the “real world”. I am happy to say I have used just about every bit of maths I learnt in school from statistics, to trig.

An ellipse, in contrast is a lot more complex and interesting. The traditional description is: take two pegs and put them in the ground, with a loop of string around them, keeping the string taught, trace an outline with a pencil in the loop of the string.

The two “pegs” are known as the foci of the ellipse, the shortest distance between points on the circumference is called the “minor axis”. The longest distance is called the major axis and it’s perpendicular to the minor axis.

Half the minor axis is known as the semi-minor axis and is denoted by the letter “b”. Half the major axis is known as the semi-major axis and is denoted by the letter “a”. The distance from the center of the ellipse to one of the foci is defined as “c”. It also turns out that the distance from one of the foci to the center apex is equal to “a”. This can be proven mathematically as I will explain below.

So, what do we know about an ellipse? Well, we know that the distance from one focus to the circumference and back to the other focus is going to be constant. Let’s call that constant “2d” for now (what we call it doesn’t really matter). So, let’s put the ellipse on the same origin as we had the circle and do some calculations for x & y.

If you look at this diagram, you see we have two right angled triangles. One is formed by k, (c+x) & y, the other by j, (c-x) & y. Using Pythagoras we can express j & k in terms of x, y & c. Since we know j + k will always equal 2D (from before).

We also know that d^{2} = c^{2}+b^{2} (Pythagoras again). d, in fact happens to be the same value as a, but we will establish that later.

I won’t bore you with the whole proof, but the details of it can be found at this wikipedia ellipse proof. I worked it out from first-principles… sort-of. I got stuck half-way but I had the right idea :).

Now we can see that x^{2}/a^{2} + y^{2}/b^{2} = 1, we can use this formula to calculate values for x and y that satisfy these requirements. Notice that because both x & y are squared here, we need to plot both negative and positive values for both, resulting in a nice rectangular solution as shown in this image.

This is all very well and good, but it’s not quite what I was looking for. Ideally, I wanted something that would enable me to trace a clockwise elliptical pattern, not just draw an ellipse. What I needed was a way to drive an ellipse point based on just an angle, a & b.

It turns out that we can use two right-angled triangles again, with one hypotenuse set to a and the other set to b.

Essentially, x changes in a circular motion described by a radius of “a” and y changes in a circular motion described by a radius of “b”.

So, in the end, the solution was a depressingly simple:

x = a cos(angle)

y = b sin(angle)