Jump to content
  • Advertisement
Sign in to follow this  

2D Graph to Isometric Projection

This topic is 4227 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I am currently trying to build an isometric map from information of a 2D array, ie X,Y I know a few methods for dual overlapping, though atm... I am really concerned about just getting the basic equation for X,Y based on Tile Width, Height, to show in the correct position, ie, a virtual x,y location ie, 0:0,1:1,2:2.. etc, and a real x,y 0:0, 32:32, etc.. though my example of a real x,y is calculated from a 2D grid. :P I have no idea, what equation to use, to get the correct real x,y position for Isometric view.. I know I need to have depth (half the height, of the isometric tile).. The width and height, have to be used... I did attempt something like x = (x * sprite.width) + sprite.width / 2 somewhat same with y, obviously this failed horridly.. So, any suggestion's, perhaps code?

Share this post

Link to post
Share on other sites
Well, I think that it would depend on how, exactly, you're displaying your final results. For example, if you're using a 3D library such as OpenGL, you could place the tiles in 3D space, position an orthographic camera, and have OpenGL (or whichever API you're using) worry about the exact projection.

However, two points in general:

  • I would recommend storing the size of a tile in screen or world space. For instance, if you know that a tile should take up 32 pixels, store a tilesize value of 32.

    When rendering, your x-position might then be x = x2d*tilesize + tilesize/2, where x is your screen- or world-space x-coordinate and x2d is the x-position stored in your array, much as you had in your post.

    Note that you may want to have a different tilesize variable for x and y, especially if you're working in 2D screen coordinates, where your tiles will probably take up less space vertically than horizontally. If, however, you are working in 3D space and your tiles are square, you should be able to use a single tilesize value

    Note too that tilesize is the size of a floor tile, but is nevertheless used for all sprites, regardless of size.

    Finally, note that this presumes that all floor tiles are of equal size; if not, this can be worked with - simply sum the sizes of the tiles up to and including the current one instead of using x*tilesize, if I'm not much mistaken.

  • Depending on where you want the origin to be, you may want to use an offset. For instance, if you want the origin to be in the centre of the map, then you should subtract mapsize*tilesize/2 from each of your coordinates, if I recall correctly, where mapsize is the number of tiles in a row of your array.

    Similarly to above, you may end up using separate calculations for x and y, depending on whether your x-tilesize and y-tilesize are different, and whether your map is square or not.

However, for more specific help, I think that it would be useful to know more specific details about what you're attempting.

Share this post

Link to post
Share on other sites
Basically... just have a grid in 2D
0 1 2 3 4 5 6 7 8
0 k x x x x x x x x
1 x x x x x x x x x
2 x x x x x x x x x
3 x x x x x x x x x
4 x x x x x x x x x
5 x x x x x x x x x
6 x x x x x x x x x
7 x x x x x x x x x
8 x x x x x x x x x

The way to show this grid in 2D would be using an array for now.. data[y][x]
ie: data[0][0] = k

Though, say x is a tile, and you wanted to display these tiles, on a grid, displaying the character value(a-z?)
for y in data.size
for x in data[y].size
draw_x = x * tilewidth
draw_y = y * tileheight

So a 2D grid is simple enough, just location the position with x*size...

I find that isometric is much more complicated, I can't do that alone obviously.. so, basically I was asking for example code, using the equations, or something to explain how to find the solution(isometric coordinate of x,y). Or links to a few pages with information I can use to learn more on isometrics so I may attempt again(spent about 4 hours trying to understand this, seem to be looking harder then I need to be, as I spent most of that time on google, reading things.)

Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Advertisement

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!