05 May 2015

Map Making

As you recall, I had no idea how to make the King of Dragon Pass map. This is not quite as dire as it sounds, since it wouldn’t really make sense to use Windows BMP data for the zones (which is my guess as to how things used to work).

(Quick recap: the actual map is a set of irregularly shaped zones. For purposes of exploration, there’s a hexagonal grid. The map you see in play is the combination of these. But the part I have to create for a new game is the zone data.)

I figured that the basic metadata was easy enough to code by hand as Lua data, like this:

["Stones"] = {flags = kFeature},

The hard part would be the (geo)graphic data. I dug out my old Wacom tablet (so old that itscustom drivers can’t be used under the current Mac OS X) and started drawing zones. Each zone was a separate layer. I couldn’t figure out how to easily export these in Acorn (which on the other hand looks like it has a great workflow for making button slices), so I used Photoshop. Unfortunately, I couldn’t use my old version, and had to get the latest “cloud” version to export transparent PNG files for each layer. For the next step, each exported PNG is the same size as the full map (most of the pixels are transparent).

I figured I could feed these to TexturePacker, and at the very least, get a file with the coordinates of each. Although I’m not using Corona, I tried using that as the export format, since it’s Lua-based. Sure enough, I got a Lua file with lines like

["Stones"] = 72,

{
  -- Stones
  x=1824,
  y=301,
  width=111,
  height=48,
  sourceX = 873,
  sourceY = 678,
  sourceWidth = 1500,
  sourceHeight = 1375
},

as well as a sprite sheet (which has the non-transparent parts of all the layers).

I can easily read the two Lua files to get game-specific metadata and the image-specific data.


Stones.png 
Although KoDP’s zone data included the bitmap, I’m just leaving that in the PNG files. (It turns out that for speed, I re-export them trimmed.)

With the zone data available, hit-testing is a simple matter of a quick check for zones whose bounding box includes a point.  If a zone passes, I need to load the PNG and see if the pixel is opaque or not.

Once hit-testing was in, I could finish the metadata. This was the tedious part of noting which zones were adjacent to other zones (which is used to figure out which clans are neighbors). I’ve worked on games where specialized tools analyze the data, but figured it wasn’t worth the effort for this particular map. It was worth the effort to visualize the data with an interactive debugging mode. Here, the zone NBE is selected, and its neighbors marked.

["NBE4"] = {neighbors = {"NBE2", "NBE3", "NBE5", "NBE10"}},

The entire process mostly concentrates on the data (drawing the zones and establishing connections). And it has an advantage over the KoDP approach in that everything is human readable.