This is next step in my series of experiments with html5 drawing capabilities. This time I make the shift to the third dimension using WebGL and applying the same principals I used in previous experiments to this one.
This doesn’t do much more than the previous experiments other than add a whole new dimension !
Check out the demo here (it requires an up-to-date browser, it works with Chrome and FF6 on my system).
Instead of rebuilding the whole stack of 3d objects from scratch (looks like a daunting task), I decided to use an API. After reading a few things here and there about it, I decided to try out Three.js. Waouh ! What a great API, it makes everything look so simple.
This is my very first ever attempt at making something in 3D, so please be indulgent. No lights, no complexe interactions with the user and stuff. What it does do is augment the bubbles from previous experiments. This time interactions are computed over 3D space and not on a 2d plane as before. And it looks pretty damn good I think.
There are some basic interactions. You can drag the pane to rotate the system in which ever direction. The mousewheel (or touchpad equivalents) allows to zoom in and out.
Check out this link to learn more about the inner works of the Three.js API.