JS1k 2015
Part 2 : Buggy Island

In the previous post, I explained that my 2014 and 2015 demos were exploring the same rendering method, which basically is a simple combination of heightmap, vertical voxels, and standard perspective calculations. The way you perform heightmap tessellation (chunking the surface into contiguous small parts) can bring bonus features, such as simple z-index compliance if you can easily bind traversal order and distance to viewer, and variable LOD if you can handle multiple tessellations with different degree of precision. One elegant (and compact) way to achieve both these goals is to use recursive tessellation, in which the surface is recursively divided into smaller parts, using a unique geometric formula.

When preparing my 2014 entry, I knew the canonical recursive tessellation scheme used in computer graphics was the well-known quadtree, but I wanted something more exotic for my use. What if each node didn't transform into 4 subnodes, but 7, one at the center, and the 6 others spread evenly around it ? Sure the surface of the juxtaposed subnodes isn't the same as the parent's (hexagons are not rep-tiles), but if you find the correct geometric transformation, all the nodes at a particular depth are perfectly contiguous. Turns out the resulting shape is well known to mathematicians under the name of "Gosper island". This island is fractal by construction, which means that, even if its surface is finite, you'd better have good shoes and some lembas if you intend to walk the coastal path (math nerd joke).

The Gosper island tessellation scheme had a number of benefits for my use:

But it also has a few intrinsic drawbacks:

Given the inherent problems and the lack of time, I struggled to put up a decent entry, but finally released "Buggy island" with the following additions:

Colors were poor, framerate was awful, glitches were outrageous, but it still managed to reach 6th place. In next post I'll explain how I put exotism aside for js1k 2015 and went back to good ol' quadtrees.