Sorry your browser is not supported!

Recently I've decided to create my own city-building game, and originally I wanted it to be 3D. However, after spending a few days attempting to work out how to make that work, I've decided it's probably easier to tackle a game like this in 2D first, and if I ever decide to expand the game I can always make it 3D then. Isometric views would definitely be the best way to go about this, lest I desire Caesar-style gameplay (read: no thank you...)

What I'm thinking about is emulating the look of Caesar 3, the problem is I've... I've never actually done anything 2D before, let alone isometric! Where would I begin, particularly in the snap-to-grid area?

Right now, I've got this old chunk of code demonstrating a basic snap-to-grid (created by BMacZero, I believe) from years ago:



Do I have to alter that in any way to for an isometric view, or do I just change how the sprites highlight each other?


So yeah, if anyone could just point me in the right direction for creating an isometric view, I would GREATLY appreciate it!

2D isometric games are actually very similar to 2D linear games. Instead of placing a block, the placing one to the right of it, you place a block, then place a block to the right and down from it. Left becomes up and left, right becomes down and right, etc.

Hope this helps!

Hmm, ok, so would that significantly change the snap-to-grid function? That's really my main concern, as I want to be sure to get it to work properly as the whole game will rely on it!

Not really, just every side-ways movement needs an up-down movement to match it. I'll do up some demo code and post it here in a little while it's really simple, you'll get it quickly

Alright, this is a TERRIBLE example, because I am super tired, but I'll post it anyway lol



Basically, it's the same as a normal grid-based system, only every second "tile" is vertically offset by half the tile image height.

There is a lot more to consider when doing Isometric beyond what has been discussed thus far.

MouseMap: in a standard top-down rectangular map the tile location that mouse is pointing to, or which tile a character sprite is in, is straight forward. However,, with an Isometric map (whether it be a slide , staggered, or diamond (btw,, you will want to use Diamond for a City building game) it's not that simple. Rather than having clean rows and columns, you have rectangular areas of tiles - although transparent - that overlap one another. Discerning which tile the character or mouse pointer is in requires a MouseMap. So what is a MouseMap? Basically it's an image that divides the actual rectangular image of you tiles (yes although you are using a diamond shape the image itself including the transparent part is still rectangular) into sections. The center section is the diamond shape which coincides with the tile you see drawn,, the corner sections coincide with the transparent triangles that aren't drawn,, but will help you determine which adjacent tile the character or mouse is in. The mouse map itself is not displayed,, it basically a look-up. So you translate the coordinates of where the mouse is on a specific tile on the map, to what color on the MouseMap image that coordinate relates to. The color beneath that coordinate determines which tile on the map. Explaining this in words is difficult.

This is what your MouseMap image will look like


This image should help make it clear of why a MouseMap is necessary. When the character is withing a given rectangle he could actually be on 1 of 5 tiles on the map. The same goes for the mouse pointer.


Here are the 3 common types of Isometric Maps
And their differing ordering of coordinates!!!!
Notice how the Diamond gives nice clean edges along the borders of the map. (Good for City Building games where the edge of the map will be seen)



Draw Order: In a standard rectangular map,, the order in which you draw tiles in not important. However,, with an Isometric map it's very important... The order will be dictated by the different types of Iso maps. The 3 common are staggered, slide, and Diamond. Also since characters need to move behind certain tiles on the map,, you have to update tiles in a specific order (again dependent on the type of Iso-map) to compensate for this.

Collisions & Anchor Points: Collisions in a standard map are again straight forward. In an Iso-map,, you need to pay attention to where you choose to anchor your character sprites and tiles.

Without you having experimented with ISO... some of what I'm stating above may not make sense right away. As you get further in you'll see why they are important concepts.

Oh wow. Maybe 3D actually would be a little bit simpler after all!

Isometric 2D would be loads of fun to do eventually, though. I'll do some more research on it after I get home from work later this afternoon as I'm very interested in using it in the future somehow!



Very correct assumption.

@CumQuaT:

Thanks for that sample! That also answers my question on how you would best generate an isometric map. I'll definitely be saving that code!

BTw the vid you linked Ceasar is regular rectangular top down. Ceasar 2 was Isometric.

Yes, the first link is just 2D squares. Much easier I think.

Indeed!

@Yodaman Jer,, I didn't mean to convey that it is uber-difficult. But it's also not as easy as a rectangular map. My post was more of foreseeing the roadblocks you were bound to encounter. Luckily,, once you have a grasp of the work that has been done with ISOgameDesign, and knowing your options,, it's really a matter of utilizing the concepts and formulas. You don't have to reinvent the wheel.Unfortunately,, much of the good reference material out there is going to be in another language,, more often C/C++ and Java. From another post it appears you have familiarity with C/C++,, and most of what you need to convert to DBpro is fairly straight forward even if you can read just the basics of C/C++.

Yeah, I linked to the first Caesar to show that that was the style I did not want to do; I want to do isometric like in Caesar 3.

I'll do more research on iso design and see what I come up with. Thanks all! +

Don't over look 3D too much! I've attached a DBpro compiled EXE that shows some of my experimenting with camera angles. All I need is a little more attention to the camera, and I think I'll be good to go with Isometric view using 3D objects.

And if anything, you could use 3D objects to generate 2D isometric sprites for your 2D game.

@Yodaman Jer,,
Just started a thread on Isometric here...
http://forum.thegamecreators.com/?m=forum_view&t=194515&b=7