Slicing an isometric tileset into subimages (Reiner Tiles)

Question

I am a beginner at graphics and I was wondering if anyone had any experience in programmatically splitting isometric tile sheets, in particular Reiner Tile Sheets Here is an Example Image:

.

I have been splitting it using guides by hand in gimp but there is some sort of pattern going on that I feel can be used to programmatically split this. Before I tried to make my own, I wanted to see if there was any such algorithms premade / software that could do it currently. Its not a simple grid that needs to be cut with same width and height for each one. Thanks for the help!

Answer 1

1. Some stuff for thinking and read

   First take a look at:

   • 2D Diamond (isometric) map editor - Textures extended infinitely?

   for some inspiration. Especially take a look at (3. tile editor) part. The operations described there are exactly what you are looking for (to add the missing stuff you are doing manually right now).

   However your tile set is oriented differently so the masks will be slightly different ...

   In case you want to extract tileset from image you would need something like this:

   • Grid image values to 2D array

   And also take a look at this (for even more inspiration):

   • Improving performance of click detection on a staggered column isometric grid

   The pixel perfect O(1) mouse selection at the end is a good idea to implement.

2. Your tile map

   so you have a tilemap image but you do not have the tiles boundaries. So first identify tileset resolution... There might be more tile sizes present so you need to know all of them. Your image is 256x1024 pixels and from a quick look you have 32x32 pixels tiles. Most of the tiles are 64x64 however they are constructed from 4 tiles of 32x32 pixels. The white color is the transparent one. So you just divide the image to 32x32 squares or regroup to 64x64 ones.