First, the necessary context: an axonometric projection is a type of parallel projection, basically meaning there’s no perspective. Further, it’s a type of orthographic projection, meaning there’s none of the distortion present in an oblique projection (which I hate with a passion). The final necessary context is that the view is rotated to reveal all major axes, as opposed to a multiview projection with a top, side and front view.

It has three further subcategories, but those aren’t important.

Image by Phasmatisnox on Wikipedia

As you can see, if you looked, the lengths of the various sides are not quite intuitive. This is important for when you’re drawing something in that style, as it’s not easy to tell what proportions it should be in. Unfortunately, information on how to determine these ratios is hard to come by.

Thus, I set to work to write a calculator. Info on how to use it is also there.

What’s special about this one is that it displays a dynamic diagram using an HTML canvas. Even better, you can drag the lines around if you don’t feel like typing angles directly. That is certainly the best feature.

I might add the functionality of calculating angles from side ratios, but as I was still implementing the angles I realised that nobody would probably ever need that. Maybe if I have some time to kill.

This is the first thing I’ve ever done with HTML canvases, and I hope that’s not too apparent from looking at it. If you’re interested, there’s a good guide on the MDN that I used to get started. Naturally jQuery is as awesome and useful as ever for dealing with javascript’s various weirdness.