Last month I described in words how I was building a clickable map using vertex colors. Well, a reader requested I make some visuals to demonstrate what I was talking about, so I whipped up a demo in Unity and grabbed a video of my screen:
You can see a tile grid with vertex colors, and all the colors are scrambled every click. Technically you could do this with multiple materials, but you would need a lot of materials (one for every color, which is basically every tile) with that approach. That creates two problems:
- You would need to store and keep track of all those materials. This is actually not that bad, but would be really annoying, and a waste of memory for a big map.
- Every material forces a draw call. This is the bigger deal, since lots of draw calls is bad for performance.
By using vertex colors, the entire map is just one mesh with one material (using a custom shader that displays vertex colors). And it’s super fast to update the colors, as opposed to rendering onto a texture or something.
The other thing apparent in this demo is the sphere moving around. I threw that in as a quick demonstration of mouse interaction. By doing a raycast against the map mesh, I can easily determine the triangle that the mouse is over. I can use that to index into a list of tile data that was generated along with the mesh, returning (among other things) the center of that tile. You can’t see it in this recording, but the debug console is also printing the name assigned to each tile.
So like I said last month, this kind of proc-gen mesh is really useful for doing a strategy game’s map!
