A Technology Blog by Kevin M. Gill

Main menu

Post navigation

Bored? Then Create a Planet

I’ve just been able to publish my latest project: PlanetMaker. This is a WebGL browser experiment for the latest versions of Google Chrome and Firefox that allows you to tweak a planetary model to your hearts content, and come up with a whole new world. See it here: http://planetmaker.wthr.us

For this I made use of the powerful three.js library for the WebGL rendering, which makes the construction of three dimensional objects amazingly easy and flexible. It also introduced me to GLSL (OpenGL Shading Language), which I had never before had a chance to work with. It was with GLSL, once I got the handle of it, that I was able to implement the city lights on the unlit side of the planet. I did this by extending the “normalmap” shader to add a greyscale texture , which I overlay over the main surface texture using a function of the city’s brightness and the inverse of the diffuse lighting value.

The atmospheric halo was adapted (read: ripped off) from another Chrome experiment that makes a striking visualization of world populations over a globe. I adjusted it to work with the changes in viewer perspectives and zooming in and out. It does produce some artifacts a little offset from the radius, which I will be debugging in the coming days. The rest of the atmosphere is achieved with fog and updated on each render to adjust for changes in perspective.

While most of the surface textures were derived from 3rd party sources (NASA, Celestia, etc), I rendered the supporting bump, normal, and specular maps using my open-source project, jDem846. The terrain was a bit exaggerated to allow the user to do the same with their planet. Since these were rendered from public data, I consider these textures to be free for anyone to use. I created the normal map for the Blue Marble clouds using a bit of a roundabout method: I hacked up a script which converted the grey scale image into a elevation raster, then ran it through jDem as if it were global elevation. The cloud bumpmap is the unmodified Blue Marble image.

I could go on at this point with some more technical details, but alas, it is late and my laptop’s battery is about dead. More to come!