• Create Account

Banner advertising on our site currently available from just \$5!

# Isometric Tile Map - Drawing

Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

7 replies to this topic

### #1slodki  Members   -  Reputation: 103

Like
0Likes
Like

Posted 30 May 2012 - 06:58 AM

Hey everyone,

I have started lately working on my 2d game which uses isometric tiles in one of game aspects, however I run into small issue. The tiles are being draw as polygons with different colors there is no problem within it as long as the tile size is 1 unit x 1 unit, unfortunatelly I require tiles being different sizes and I stuck here.

Obviously the points for tile 1x1:

Top: x + w/2, y
Right: x + w, y+h/2
Bottom: x+w/2, y+ h
Left: x, y+h/2

The question is how do I apply different sizes to it? The tiles could be 2x3 ,3x2 (x/y)etc. Is there a simple to do it or I will have to test sizeX / sizeY and create the points different way?

Any help would be appreciated,
Many thanks

### #2Dawoodoz  Members   -  Reputation: 335

Like
0Likes
Like

Posted 30 May 2012 - 10:32 AM

If you are using a 3D engine for drawing the polygons then you just need to use an orthogonal camera.

My open source DirectX 10/11 graphics engine. https://sites.google.com/site/dawoodoz

"My design pattern is the simplest to understand. Everyone else is just too stupid to understand it."

### #3slodki  Members   -  Reputation: 103

Like
0Likes
Like

Posted 30 May 2012 - 03:05 PM

I know how to draw the map itself, thats not the issue here. My problem is more maths related, wrong topic title has been given.

My map required a polygons with sizes 1x1,1x2,1x3,1x4,1x5,2x1,2x2 ....

I dont have an problem drawing all same sized tiles 1x1,2x2,3x3,4x4,5x5 (blue tiles), the problem comes along with red tiles. There need to be a simple way to calculate their points (right middle, bottom middle, left middle).

I have been looking around for some articles about it, other topics but couldnt find anything. The only way I can see would be checking if (sizeX==sizeY) or (sizeX > sizeY) or (sizeX < sizeY) and using different function for each of this types. The function would return a vector with points, however it will require 3 functions for 3 types and I would like to avoid it. There needs to be a different way doing it, I just can't figure it out,

### #4DementedCarrot  Members   -  Reputation: 786

Like
0Likes
Like

Posted 30 May 2012 - 03:10 PM

Can you give us a screenshot of what it's doing wrong?

### #5FLeBlanc  Crossbones+   -  Reputation: 3129

Like
2Likes
Like

Posted 30 May 2012 - 04:41 PM

If you use an orthographic projection with a camera oriented 45 degrees around the y axis--ie, use a real projection instead of a 2D hack of a 3D projection--then those areas all become simple rectangles in world space, and you don't have to worry about hacking a bunch of special-case functions.

Edited by FLeBlanc, 30 May 2012 - 04:42 PM.

### #6BugShan  Members   -  Reputation: 115

Like
0Likes
Like

Posted 19 June 2012 - 10:43 AM

Top: x + w/2, y
Right: x + w, y+h/2
Bottom: x+w/2, y+ h
Left: x, y+h/2

as you have written,i dont know what the point (x,y) does mean,and the also as the w and h.if w for width ,h for height,then the point(x,y) would not be the center point of the title.if in this case ,what about the point of the title( 2 X 3)?

So,i cant say something ,but if you just display it just as the image as you have provided,you can set the (x,y) as the left point and have a try.It will be easier or you can provide more details

### #7Syranide  Members   -  Reputation: 375

Like
0Likes
Like

Posted 20 June 2012 - 08:14 AM

I'm not sure if I really understand your issue, but I assume you are having issues with the objects rendering in the wrong order and overlapping incorrectly for your isometric view?

An image or an explanation of the actual issue would be helpful.

Edited by Syranide, 20 June 2012 - 08:15 AM.

### #8DvDmanDT  GDNet+   -  Reputation: 1241

Like
0Likes
Like

Posted 20 June 2012 - 08:57 AM

I assume you draw from top to bottom, and that the y coordinate is the highest point of the rectangle and that the x coordinate is the left point of the topmost sub-tile.

Top.X = x + WidthPerTile / 2
Top.Y = y

Left.X = x - RowsOfThisTile * WidthPerTile / 2
Left.Y = y + RowsOfThisTile * HeightPerTile / 2

Bottom.X = Left.X + ColsOfThisTile * WidthPerTile / 2
Bottom.Y = Left.Y + ColsOfThisTile * HeigthPerTile / 2

Right.X = Top.X + ColsOfThisTile * WidthPerTile / 2
Right.Y = Top.Y + ColsOfThisTile * HeightPerTile / 2

I'm not 100% sure this is correct, but I assume you are looking for something like this?

Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

PARTNERS