4
\$\begingroup\$

I have isometric assets that unfortunately can't change and need to work out the projection for those. Here is how a tile looks like:

floor tile

The tile image width/height ratio is 0.(6) (height/widht = 1.5). Since this is isn't the standard(2:1) isometric ratio, how can I work out the iso-screen/screen-iso coordinate conversion functions ?

\$\endgroup\$
2
  • \$\begingroup\$ Minor quibble: you should use the term "orthographic" for this type of projection. "Isometric" is a very specific subset of orthographic projections, where unit vectors on each axis project to the same length (iso metric = equal measure). A true isometric tile will have a width:height ratio of sqrt(3) : 1. If that's not your ratio, then you're not using isometric projection, just a similar-looking orthographic projection. en.wikipedia.org/wiki/… \$\endgroup\$
    – DMGregory
    Mar 25, 2014 at 17:56
  • \$\begingroup\$ True, I tend to use orthographic projection when I mean cylindrical as opposed to conical \$\endgroup\$ Mar 25, 2014 at 20:04

3 Answers 3

4
\$\begingroup\$

Having recently done a pixel to tile, tile to pixel conversion I understand this can get difficult quickly. You have a ratio of 0.6, usually the ration is 0.5, is this correct?

Also there are a number of ways to draw your tiles, diamond (chess board), staggered (Civ type game) etc.

Here is an answer to a similar question made by coobird (better than i ever could)

https://stackoverflow.com/questions/892811/drawing-isometric-game-worlds

Here is a more in depth article that you should be able to use the work out the answer you need.

http://www.lingoworkshop.com/Articles/Isometric_Game_1.php

Good luck :)

\$\endgroup\$
3
  • \$\begingroup\$ Thanks for the neat answer! That ratio is getting to me. The image w/h ratio is 0.66666667 (~ 0.(6) ), but I selected the bounding rectangle of the image non transparent content and that has a ratio of ~1.275. I'm getting close, but because of the numbers that don't divide nicely I get a few pixels off every few tiles. The articles look really explained. I'll take my time and go through them. Will let u know how this goes \$\endgroup\$ Jun 19, 2012 at 14:00
  • \$\begingroup\$ Thats fine George, i'm using other peoples answers here. These are the articles which helped me. I'm at work now so dont have my engine code here but when i get time i will see if i can solve the issue but if you have a ratio of 0.666666666 could you not use (2/3) to get your isometric ratio? Ive just seen that you have a larger destination rectangle with a definable ratio and an offset, so you should be able to use the standard formulas with offset tweeks. If you have further issues post more code and i'll have a play. \$\endgroup\$
    – LoveofSnow
    Jun 19, 2012 at 15:01
  • \$\begingroup\$ Richard, I've gone through the resources, written a lot of code and so far so good! I have to squeeze your brains for another tip though: The designers can't render to a 2:1 because some elements will get occluded by walls at that angle, so that's why the custom angles/ratios. The problem with custom ratios is when I do the conversion and place bitmaps, (because of rounding I presume), the issue is bitmaps don't always align properly: every few tiles there's a 1px offset. Any hints on what ratio I should use to eliminate or make this issue less visible ? Thanks ! \$\endgroup\$ Jun 21, 2012 at 15:48
2
\$\begingroup\$

The best explanation I have found of Orthographic/Cartesian to Isometric conversion is from this article.

BLOCK_SIZE = [64, 32]


def orth_to_iso(x, y):
    ''' Converts cartesian to isometric cordinates '''

    try:
        xx = (x - y) * (BLOCK_SIZE[0]/2)
        yx = (x + y) * (BLOCK_SIZE[1]/4)
    except Exception:
        xx = -1
        yx = -1

    return [xx, yx]


def iso_to_orth(x, y):
    ''' Converts isometric to cartesian coordinates '''

    try:
        xx = (x / (BLOCK_SIZE[0]/2) + y / (BLOCK_SIZE[1]/2)) /2
        yx = (y / (BLOCK_SIZE[1]/2) -(x / (BLOCK_SIZE[0]/2))) /2
    except Exception:
        xx = -1
        yx = -1

    return [xx, yx]
\$\endgroup\$
1
\$\begingroup\$

Not being able to see the code or textures its difficult but if its not the tile itself being occluded then split the textures into two, ie if its a tile with a building on then draw the tile (at a 2:1 ratio) then 'layer' the building on top of that tile. This should work and you should be able to hold that 2,1 ratio.

\$\endgroup\$

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .