Atomic orbital viewer with WebGL

Recently I found an application that I wrote more than 10 years ago — atomic orbital viewer. Back then I got interested in the pictures of atomic orbitals you get presented in chemistry class, found the special-case formulas for electron distribution and generalized them. And then I wrote an application to visualize these orbitals. Since I didn’t have access to 3D hardware or even literature on 3D graphics I ended up reinventing everything — yes, I used to have that kind of time back then. What came out was a Turbo Pascal (DOS) application where I’ve written almost everything myself, including low-level mouse handling and GUI library.

The big surprise was that this application still more or less worked under Windows XP – if you don’t count occasional stripes in the picture and the cases where it crashed taking down the entire system (probably side-effects of a non-standard VESA graphics driver). Not so much under Windows Vista, it no longer supports graphical DOS applications. Still an application that I would like to have around, so time to reimplement things from scratch. And what’s the technology of choice these days? WebGL! Taking vlad’s Spore viewer as a starting point, it still took me something like 10 hours (I’ve never worked with OpenGL and my linear algebra is a little rusty) but the result is much better than the original application. And with some luck it will still be usable in another 10 years and more.

Orbital viewer screenshot

Click here to try it out in a current Firefox nighty build (make sure to change webgl.enabled_for_all_sites pref to true). It will probably work in WebKit nightlies as well but I didn’t check. The hardware improved a lot since the time I wrote my original application, these days all calculations are so fast that I didn’t even bother optimizing them (yes, I know that it would be easy to speed them up by factor 4, not to mention using web workers). And even my laptop has no trouble rotating 64k triangles in real time. Enjoy!


  • Aerik

    The nerds at should like this.

  • laszlo

    Off-topic: Congrats on getting your Mozilla-defending letter to the editor printed in c’t, Wladimir :-)

    Wladimir Palant

    Lol. It was simply a clarification and I didn’t expect it to be printed. Thanks :)

  • Lee

    I’ve been using adblock for a while, but just recently I’ve been getting disturbing pictures in place of adds is there any way i can change the picture that shows up?

    Wladimir Palant

    I suggest you ask in the forum (no registration required, just press “New topic”) – this cannot be answered without additional questions and an unrelated blog post isn’t the right place for it.