🔒 Locked

Isometric Tile Map - Drawing

Started by slodki May 30, 2012 at 12:58 PM 6 replies 2.8k views

Original Post

May 30, 2012 at 12:58 PM

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

Dawoodoz

May 30, 2012 at 4:32 PM

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

slodki

May 30, 2012 at 9: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).

[attachment=9151:iso_map.png]

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,

BrentMorris

May 30, 2012 at 9:10 PM

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

FLeBlanc

May 30, 2012 at 10: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.

BugShan

Jun 19, 2012 at 4:43 PM

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

Syranide

Jun 20, 2012 at 2:14 PM

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.

DvDmanDT

Jun 20, 2012 at 2:57 PM

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?

Topic Locked

This topic has been locked by a moderator. New replies are not allowed.