Sign in to follow this  

Mapping X/Y coords to isometric coords

This topic is 4107 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

Greetings, I'm writing my first isometric style game and found some helpful articles on GameDev, but now I gotten stuck... How do I mathematically convert the values from a two dimensional array against the tiles in my isometric map? Let's say I got the following array: 0 1 2 3 4 0 . . o . . 1 . o o o . 2 . . o . . 3 . . o . . 4 . . . . . I want to loop through this array and paint each "o" onto the map accordingly - but the iso coordinates doesn't match the simple x/y coordinates in the array. In other words: How do I calculate the iso x/y coordinates based on the x/y coordinates in my array? Any help would be greatly appreciated.

Share this post


Link to post
Share on other sites
if I understand correctly,thats the array with tile indexes.
Lets say you have the tiles in
BITMAP tiles[100];
and have a function that puts bitmap on screen
blit(bitmap_source,x,y);
You know the tile width/height in
int tile_w,tile_h;
to draw the map you need double loop,once for the rows,and once for the columns.
for(i=0;i<rows_on_map;i++)
for(j=0;j<columns_on_map;j++)
blit(times[map_array[i][j]],i*tile_w,j*tile_h);

maybe you'll have to swap x/y ,sory for the poor/short explaination but i'm in a hurry hope this'll help you .

Share this post


Link to post
Share on other sites
Quote:
Original post by Winterhell
if I understand correctly,thats the array with tile indexes.
Lets say you have the tiles in
BITMAP tiles[100];
and have a function that puts bitmap on screen
blit(bitmap_source,x,y);
You know the tile width/height in
int tile_w,tile_h;
to draw the map you need double loop,once for the rows,and once for the columns.
for(i=0;i<rows_on_map;i++)
for(j=0;j<columns_on_map;j++)
blit(times[map_array[i][j]],i*tile_w,j*tile_h);

maybe you'll have to swap x/y ,sory for the poor/short explaination but i'm in a hurry hope this'll help you .


Thanks for your answer but the looping isn't the problem. The problem has to do with the mapping between the coordinates in my array and the way they are diaplayed in the iso map.

If I want do display 6 bitmaps on the iso map according to my ascii illustration, I cannot place them at the same coordinates as in my array due to the fact that the iso map has a compleatly different logic as to determine which tiles are adjacent (depending on whether the y coord is odd or even).

I need a method that takes translates a "simple" x/y coord into an isometric one, something like:

Point ConvertTileIndexToIsoIndex(Point tileIndex)
{
// ...
return new Point(x, y);
}

But I need help to make that conversion...

Thanks!

Share this post


Link to post
Share on other sites
I used to do some iso work in flash some times ago. Hope this help.

to set isometric tile position :

for (var x = 0; x for (var y = 0; y
if(!((x==this.Width-1) && (y%2)))
{
this.Cases[y*this.Height+x] = _root.gameboard.attachMovie(”tile2″, “t_”+x+”_”+y, _root.gameboard.getNextHighestDepth());

this.Cases[y*this.Height+x]._x = (x)*this.TileSize+((y%2)*this.TileHeight)+this.OffsetX;
this.Cases[y*this.Height+x]._y = (y)*this.TileSize/4+this.OffsetY;
this.Cases[y*this.Height+x].p.text = x + “,” + y;
}
}
}


and to get tile at screen position

function ScreenToTile(xa:Number, ya:Number){
var x = Math.floor((xa - this.OffsetX) / this.TileSize);
var y = Math.floor((ya - this.OffsetY) / this.TileHeight); var modx = 0;
var mody = 0;

if(xa-this.OffsetX-(x*this.TileSize) > (2*(ya - this.OffsetY-y*this.TileHeight))){
if(xa-this.OffsetX-(x*this.TileSize) < 2*(this.TileSize/2-(ya - this.OffsetY-y*this.TileHeight))){
mody--;
}
else {
x++;
}
}
else {
if(xa-this.OffsetX-(x*this.TileSize) < 2*(this.TileSize/2-(ya - this.OffsetY-y*this.TileHeight))){
}
else {
y++;
mody--;
}
}

return new classes.core.CPoint(x, y*2+mody);
}

tiles


[Edited by - j0hn on September 16, 2006 6:21:24 AM]

Share this post


Link to post
Share on other sites
when i was doing this i drew them all in a square formattion then i altered there position a bit, recompiled, run, look, eventually through trial and error i figured out how to do it.

Then i reversed the computation to get screen to array.

However if your tiles have different heights i think you need to be more inventive.

Share this post


Link to post
Share on other sites
Quote:
Original post by Riviera Kid
when i was doing this i drew them all in a square formattion then i altered there position a bit, recompiled, run, look, eventually through trial and error i figured out how to do it.

Then i reversed the computation to get screen to array.

However if your tiles have different heights i think you need to be more inventive.


Interesting, you wouldn't happen to have that code lying around would you?

Thanks

Share this post


Link to post
Share on other sites
XoffsetX = (arrayposX/2)*tilewidth + (arrayposX%2)*tilehalfwidth
XoffsetY = -(arrayposX/2)*tileheight - (arrayposX%2)*tilehalfheight

YoffsetX = -(arrayposY/2)*tilewidth - (arrayposY%2)*tilehalfwidth
YoffsetY = -(arrayposY/2)*tileheight - (arrayposY%2)*tilehalfheight

screenposX = screenoffsetX + XoffsetX + YoffsetX
screenposY = screenoffsetY + XoffsetY + YoffsetY

screenposX = screenoffsetX + (arrayposX-arrayposY)/2*tilewidth - (arrayposX-arrayposY)%2*tilehalfwidth
screenposY = screenoffsetY - (arrayposX+arrayposY)/2*tileheight - (arrayposX+arrayposY)%2*tilehalfheight

Depending on how you want your coordinate system set up, you might have to change some values, but this should give you an idea of the math. The current coordinate system has X pointing down right and Y pointing down left (the isometric one that is).

Hope it helps

[Edited by - Necator on October 5, 2006 8:42:28 AM]

Share this post


Link to post
Share on other sites
Quote:
Original post by Necator
XoffsetX = (arrayposX/2)*tilewidth + (arrayposX%2)*tilehalfwidth
XoffsetY = -(arrayposX/2)*tileheight - (arrayposX%s)*tilehalfheight

YoffsetX = -(arrayposY/2)*tilewidth - (arrayposY%2)*tilehalfwidth
YoffsetY = -(arrayposY/2)*tileheight - (arrayposY%s)*tilehalfheight

screenposX = screenoffsetX + XoffsetX + YoffsetX
screenposY = screenoffsetY + XoffsetY + YoffsetY

screenposX = screenoffsetX + (arrayposX-arrayposY)/2*tilewidth - (arrayposX-arrayposY)%2*tilehalfwidth
screenposY = screenoffsetY - (arrayposX+arrayposY)/2*tileheight - (arrayposX+arrayposY)%2*tilehalfheight

Depending on how you want your coordinate system set up, you might have to change some values, but this should give you an idea of the math. The current coordinate system has X pointing down right and Y pointing down left (the isometric one that is).

Hope it helps


What does your variable "s" refer to?

Thanks

Share this post


Link to post
Share on other sites

This topic is 4107 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.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this