Random dev doodling – JavaScript 3D cube

Being a developer, I spend quite a bit of time playing around with programming bits and bobs. A little while ago, I had a relatively old Nokia that supported J2ME (without floating point) so I decided to try and write a simple 3d renderer for it – having no FPU (floating point unit) I had to write an integer math library, and sine/cosine lookup tables against the math library. This was all good stuff, and reminded me some of the maths I learnt at uni, and some good optimization tricks.

A couple of months after that, bored one afternoon, I decided to write something similar in JavaScript – modern browsers have decent JavaScript engines with good floating point support, so it was a lot easier… after proving that it could be done, I lost interest, but here’s where it go to.

Just a (very) simple 3D wireframe cube renderer, but done using a <canvas> tag, a fairly standard 3D matrix, and some javascript.

You can see it in action here – not sure if it works in every browser (more than likely doesn’t) but it definitely works in FireFox and Chrome.






Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.