Posted by: EvilNando | July 22, 2008

Rendering dilemmas: Z-Ordering, Grass and Camera Clipping




Today has been a ridiculously hot day, which forced me to stay on the couch watching videos instead of coding for most of the day.

The only progress Ive made so far is getting the Z-ordering of sprites correctly and optimizing the render code of the engine, once you see this numbers you will be impressed on how much a simple if() check could increase the rendering performance.

If youre one of those who are using my TileEditor you will be already familiar by the concept of layers.

layers ex


Layers are helpful to give the impression that certain objects are “higher” than the rest.

In my case I decided to build maps with only 4 layers of depth. and those are distributed like this:

  • Layer 1: main ground type (grass, swamp, desert…)
  • Layer 2: ground detail (taller grass, darker grass…)
  • Layer 3: details ( waterfalls, buildings, signs … )
  • Layer 4: Everything that should appear on top of the characters

Following this table I placed trees and bridges on layer 4, until now the engine code was just rendering the characters at the end of the map Draw() method, but having this layering mindset from the start made the sprite ordering as trivial as checking if layer 3 had finished rendering and then insert the Actor Draw() method there before continuing into the Layer 4 rendering code.


The result: (see the character is now “behind” the tree)



With this feature in place I proceeded to improve the rendering code, I wanted to have camera clipping so I dont waste resources rendering what is outside of the camera view.

The only thing needed was to pass the camera data into the Map’s rendering code, so at the render time the map could ask the camera its current dimensions. if the actual Tile to be renderer is not inside the camera limits then skip this render loop.

I was a little curious on how much performance I was getting by doing this since on my laptop I was getting 60fps regardless of the code being there.

So I added a variable which saved how many Draw() calls where being made.

Here are the results:

Without optimizations



With optimizations



A BIG difference, right?

Now I want to talk about one dilemma that I have, which Im still trying to figure out, it about “grass” yes grass.

The problem is that I’ve seen many 2D RPG games where whenever the character walked over some tall grass , a portion of that grass would appear in front of the character, giving the illusion of walking into tall grass.

So I tried this but here are the current results I’m getting:



The current solution I have in mind, is to draw a small patch of grass on of any actor that is walking over a tile of grass.

While this works it is only because I’m not thinking of the actor moving, but as soon as I do I can see that this is no longer a viable solution , as you can see in the picture above.

So this is it for today, Ill be drawing things on my notebook trying to sort out this problem

Have a nice day / night.



  1. For the grass part. Think about a constant flipping of the grass tile ahead or something.

  2. For the grass, you could make a mask of the character, and not draw that part of the mask while in grass. Therefore, it wouldn’t draw the feet/waist or w/e while inside a grass tile.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s


%d bloggers like this: