Skip to main content

User login

What is OpenID?
  • Log in using OpenID
  • Cancel OpenID login
  • Create new account
  • Request new password
Register
  • Home
  • Browse
    • 2D Art
    • 3D Art
    • Concept Art
    • Textures
    • Music
    • Sound Effects
    • Documents
    • Featured Tutorials
  • Submit Art
  • Collect
    • My Collections
    • Art Collections
  • Forums
  • FAQ
  • Leaderboards
    • All Time
      • Total Points
      • Comments
      • Favorites (All)
      • Favorites (2D)
      • Favorites (3D)
      • Favorites (Concept Art)
      • Favorites (Music)
      • Favorites (Sound)
      • Favorites (Textures)
    • Weekly
      • Total Points
      • Comments
      • Favorites (All)
      • Favorites (2D)
      • Favorites (3D)
      • Favorites (Concept Art)
      • Favorites (Music)
      • Favorites (Sound)
      • Favorites (Textures)
  • ❤ Donate
General Discussion

How do you tile isometric?

Anonymous
Monday, January 31, 2011 - 12:33

How do isometric tiles fit together if each of their corners are transparent this would leave gap when putting them next to each other on a tiled map surely?

  • Log in or register to post comments
bart
joined 13 years 11 months ago
Monday, January 31, 2011 - 16:30
bart's picture

Well, obviously you can't just draw them like you would square tiles. :)

I think there are some isometric tiling tutorials out there that can give bettter info than I can, but here's how I'd imagine they would be drawn:

  • Assume the (0, 0) tile is the corner at the top of the screen.  Draw that one first.
  • Step trough the map by diagonal row.  So you draw (0, 0) first, then the row below that would be (0, 1) and (1, 0).
  • The row below that is (0, 2), (1, 1), and (2, 0), and so on.  Notice that each row starts with a Y value that's 1 higher than it was last time, then you move through the row by adding 1 to X and subtracting 1 from Y until Y = 0.
  • Contine the above steps until Y reaches the maximum Y value of the map.  From then on, Y should stay at that value, and you start adding to X instead.
  • How you stagger the tiles as you draw them depends on the exact dimensions of the tiles themselves.  Experiment until you're satisfied that they're lined up correctly.  You may want to make some bare tiles with a one pixel border to play around with so you know you're drawing them correctly.
  • Drawing "3D" iso maps (that is, iso maps that can have more than one layer) is easy.  As you draw each (x, y) tile on the map, draw the bottom tile first and then work upwards

Now, as with all programming, there are tons of different ways to do it.  Don't assume mine is the best -- it's just one way to go about it, and should be taken with a grain of salt since I've never written an isometric engine.  Look at the tutorials that are out there.  Here's one to get you started:

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

Bart

 

  • Log in or register to post comments