Writing an isometric engine in pure 2D was one of the first engines I made when I was 19 years old, back in 2001. I already had a relatively long experience with 3D making, but not 2D. It was for a clone of the Equinox game (SNES). What surprised me the most at that time, it was the absolute lack of real literature about the topic. The biggest issue was occlusions, because in pure 2D you can't use a native depth buffer. There are several solutions. If you have access to the image pixels, one solution (the simplest) is to program a simplified depth buffer, using a depth-channel for the tiles, or algorithmically obtaining the missing image from a bounding-box around the tile, obviously with the same geometric transformations as the engine. If, on the other hand, you don't have access to pixels (or can't store a depth buffer) but can only draw blocks of tiles (my old scenario), things get complicated.
You need to develop an algorithm that resolves occlusions recursively to calculate what-is-behind-what, taking tiles position and size into account. To start, you need to think about how to handle occlusions with just two boxes. The order only matters if the two boxes overlap, so you only need to solve if the rectangles enclosing the boxes overlap. If they overlap, the order can be calculated as follows (Y pointing up):
if (box1.bottom > box2.top) {
// box2 first, box1 last
} else if (box1.top < box2.bottom) {
// box1 first, box2 last
} else {
if (box1.near > box2.far || box1.left > box2.right) {
// box1 first, box2 last
} else {
// box2 first, box1 last
}
}
I couldn't find this formula in any book or online tutorial, I found it in the past using my brain and it worked, so feel free to use it. The algorithm can be easily extended to calculate order priority with any number of boxes by using a simple topological sorting. For every pair of boxes that overlap on the screen, use the formula to see which is behind the other and increment a counter for the block that is covering the other (A is behind C (+1), B is behind C (+1), B is behind A (+1)). At the end you have: B(0), A(1) and C(2), which is the correct order on screen. Note that if you checked A against C, you don't need to check C against A in the next iteration (avoid double counting). The overall complexity for N overlapping boxes is of ((N - 1) * N) / 2 checks.
You can download a demo of the isometric engine for Windows here:
This demo is not a great evolution of the demo already published on youtube. The big difference is in the clean up and the fact that you can safely run in your pc without issues (be sure to have vulkan libraries installed). If you like this project and you want that it will be continued in the future, please make a donation to support my work. It will be appreciated.
The layout of the mesh doesn't have to match exactly with the material's one: if the mesh has the required vertex attribute then it's used, otherwise 0 values are used instead. It's for the material to decide how to use the vertex attributes offered by the mesh. In this way, a single material can be used to render any kind of mesh. Of course, a mesh without normals cannot render diffuse or specular, or without texcoords cannot render textures, normal maps and so on.
