• Advertisement
Sign in to follow this  

Unity Drawing tiles on a grid

This topic is 3480 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

To make my 2D map (see this post) i have decided to split it up into smaller (256x256) OpenGL textures. Now i need some code to draw the tiles that are in view on the screen. I don't know whether to loop through all tiles and check if each will be visible on screen, or if i should use some fancy maths to calculate the array index of the start and end tiles in the x and y direction. Here is some of the code i have so far:
/*  numTileX and numTileY are the number of tiles in the x and y direction
 *  texTileSize is the size of the square texture (256x256)
 *  drawGLTexture function is listed below. Ignore imgW, imgH, wrapX, wrapY, and angle as these
 *        are not used here, i don't need to stretch or tile each tile
void Map::draw() {
    // Also need to tile or stretch the background image.
    drawImage(background.image, 0, 0, screenWidth, screenHeight);

    for (int j = 0; j < numTileY; j++) {
        for (int i = 0; i < numTileX; i++) {
            drawGLTexture(tiles[j*numTileY+i].texId, i*texTileSize, j*texTileSize,
                     texTileSize, texTileSize, ...);

// In file Graphics.cpp
void graphics::drawGLTexture(GLuint id, int x, int y, int w, int h,
                int imgW, int imgH, int wrapX, int wrapY, float angle) {
    // Rotate the matrix if the image is at an angle
    if (angle != 0) {
        glRotatef(angle, 1.0f, 0.0f, 0.0f);

    // Scale image coords to texture coords [0.0-1.0]
    float tw = 1.0f, th = 1.0f;
    if (wrapX == TILE)  tw = float(w)/float(imgW);
    if (wrapY == TILE)  th = float(h)/float(imgH);

    // Draw quad with texture
    glBindTexture(GL_TEXTURE_2D, id);
    glTexCoord2f( 0,  0); glVertex2i( x,   y );
    glTexCoord2f( 0, th); glVertex2i( x,  y+h);
    glTexCoord2f(tw, th); glVertex2i(x+w, y+h);
    glTexCoord2f(tw,  0); glVertex2i(x+w,  y );

    // Restore rotation
    if (angle != 0)

Here is a diagram of what i want: I need to draw the tiles that will be totally or partially visible on the screen. I also don't know if i should manually clip the tiles to the screen by drawing a quad with part of the texture on it, or if it would be faster if i just draw it partially off-screen and let OpenGL do the clipping. If anyone has similar code from their game or knows of a good website that explains how to do it then that would be great. Otherwise i would just like to know the best/easiest way to do it. thanks

Share this post

Link to post
Share on other sites
If all you need to render is less than 10 256x256 textures, then you can just render all totally or partly visible tiles, since this is peanuts for even an older graphics card. You will be amazed of just how many commands and textures you can throw after modern cards without notice.
For the detection of which tiles are visible, this will probably not be a bottleneck even with larger maps, but there are anyways at least 2 faster solutions.
One of them is to calculate the array index via the fancy math, as you described, but it really is not that tricky. Assuming your map starts at (0, 0), your world units are pixels, and you have saved the screen position (sp) as the lower left coordinate of the screen space (assuming GL coordinate system), you need to render tiles from x1 = ((sp.x - sp.x % 256) / 256) to x2 = ((sp.x + sp.x % 256) / 256) and from y1 = ((sp.y - sp.y % 256) / 256) to y2 = ((sp.y + sp.y % 256) / 256). It might not be bulletproof (as it is untested), but it should get you an idea of what you need.
The other solution, which probably is not what you really want for a smal-scale project, is to make a quadtree or a kd-tree and make/perform render queries on those. So you probably just want to stick with the first solution :)

Share this post

Link to post
Share on other sites
Yeah, i think i will do the first option. It's not really fancy maths but it would require a bit of thought. Your equations look pretty straight foward.
And btw, that diagram was just to illustrate what i was doing, in reality there would be more tiles than that. As i think i mentioned, the size was 256x256, and my screen will be 800x600 or a bit longer for wide-screen monitors (i will scale up rather that using actual monitor size). So i will have 6 fully visible tiles with at most 20 tiles (fully or partially visible). This is still probably not a problem even on my machine*. And the size will be read from a settings file so the user can change it if need be.

* Laptop, 1.73GHz Pentium M, Intel 915GM/GMS,910GML

Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Advertisement
  • Advertisement
  • Popular Tags

  • Advertisement
  • Popular Now

  • Similar Content

    • By Manuel Berger
      Hello fellow devs!
      Once again I started working on an 2D adventure game and right now I'm doing the character-movement/animation. I'm not a big math guy and I was happy about my solution, but soon I realized that it's flawed.
      My player has 5 walking-animations, mirrored for the left side: up, upright, right, downright, down. With the atan2 function I get the angle between player and destination. To get an index from 0 to 4, I divide PI by 5 and see how many times it goes into the player-destination angle.

      In Pseudo-Code:
      angle = atan2(destination.x - player.x, destination.y - player.y) //swapped y and x to get mirrored angle around the y axis
      index = (int) (angle / (PI / 5));
      PlayAnimation(index); //0 = up, 1 = up_right, 2 = right, 3 = down_right, 4 = down

      Besides the fact that when angle is equal to PI it produces an index of 5, this works like a charm. Or at least I thought so at first. When I tested it, I realized that the up and down animation is playing more often than the others, which is pretty logical, since they have double the angle.

      What I'm trying to achieve is something like this, but with equal angles, so that up and down has the same range as all other directions.

      I can't get my head around it. Any suggestions? Is the whole approach doomed?

      Thank you in advance for any input!
    • By devbyskc
      Hi Everyone,
      Like most here, I'm a newbie but have been dabbling with game development for a few years. I am currently working full-time overseas and learning the craft in my spare time. It's been a long but highly rewarding adventure. Much of my time has been spent working through tutorials. In all of them, as well as my own attempts at development, I used the audio files supplied by the tutorial author, or obtained from one of the numerous sites online. I am working solo, and will be for a while, so I don't want to get too wrapped up with any one skill set. Regarding audio, the files I've found and used are good for what I was doing at the time. However I would now like to try my hand at customizing the audio more. My game engine of choice is Unity and it has an audio mixer built in that I have experimented with following their tutorials. I have obtained a great book called Game Audio Development with Unity 5.x that I am working through. Half way through the book it introduces using FMOD to supplement the Unity Audio Mixer. Later in the book, the author introduces Reaper (a very popular DAW) as an external program to compose and mix music to be integrated with Unity. I did some research on DAWs and quickly became overwhelmed. Much of what I found was geared toward professional sound engineers and sound designers. I am in no way trying or even thinking about getting to that level. All I want to be able to do is take a music file, and tweak it some to get the sound I want for my game. I've played with Audacity as well, but it didn't seem to fit the bill. So that is why I am looking at a better quality DAW. Since being solo, I am also under a budget contraint. So of all the DAW software out there, I am considering Reaper or Presonus Studio One due to their pricing. My question is, is investing the time to learn about using a DAW to tweak a sound file worth it? Are there any solo developers currently using a DAW as part of their overall workflow? If so, which one? I've also come across Fabric which is a Unity plug-in that enhances the built-in audio mixer. Would that be a better alternative?
      I know this is long, and maybe I haven't communicated well in trying to be brief. But any advice from the gurus/vets would be greatly appreciated. I've leaned so much and had a lot of fun in the process. BTW, I am also a senior citizen (I cut my programming teeth back using punch cards and Structured Basic when it first came out). If anyone needs more clarification of what I am trying to accomplish please let me know.  Thanks in advance for any assistance/advice.
    • By Yosef BenSadon
      Hi , I was considering this start up http://adshir.com/, for investment and i would like a little bit of feedback on what the developers community think about the technology.
      So far what they have is a demo that runs in real time on a Tablet at over 60FPS, it runs locally on the  integrated GPU of the i7 . They have a 20 000 triangles  dinosaur that looks impressive,  better than anything i saw on a mobile device, with reflections and shadows looking very close to what they would look in the real world. They achieved this thanks to a  new algorithm of a rendering technique called Path tracing/Ray tracing, that  is very demanding and so far it is done mostly for static images.
      From what i checked around there is no real option for real time ray tracing (60 FPS on consumer devices). There was imagination technologies that were supposed to release a chip that supports real time ray tracing, but i did not found they had a product in the market or even if the technology is finished as their last demo  i found was with a PC.  The other one is OTOY with their brigade engine that is still not released and if i understand well is more a cloud solution than in hardware solution .
      Would there  be a sizable  interest in the developers community in having such a product as a plug-in for existing game engines?  How important  is Ray tracing to the  future of high end real time graphics?
    • By bryandalo
      Good day,

      I just wanted to share our casual game that is available for android.

      Description: Fight your way from the ravenous plant monster for survival through flips. The rules are simple, drag and release your phone screen. Improve your skills and show it to your friends with the games quirky ranks. Select an array of characters using the orb you acquire throughout the game.

      Download: https://play.google.com/store/apps/details?id=com.HellmodeGames.FlipEscape&hl=en
    • By khawk
      Watch the latest from Unity.
  • Advertisement