Mapping X/Y coords to isometric coords

Started by
7 comments, last by Necator 17 years, 7 months ago
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.
Advertisement
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[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 .
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[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!
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]
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.
--------------------------------Dr Cox: "People are ***tard coated ***tards with ***tard filling."
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
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]
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
sorry. Just a typo =/
I corrected it in my original post. the s are supposed to be a 2

This topic is closed to new replies.

Advertisement