Depth sorting in a Birds Eye view game (top down dimetric)

(Hussein Tammam) #1

Hi,

I have a small issue with a game im working on. it has a birds eye view seen clearly in games like Pokemon or A link to the past. Basically the problem is with the layering of the sprites. What I’m trying to do is have the character sprite be able to go behind or infront of a tile and appear in the right layer. How would I go about changing the player’s layer in runtime based on his position. For example, making a wall render in front of a sprite or behind him. Also I don’t know if i should start a new thread for this but is there already a spriter flashpunk implementation out there, or should I just make my own?

(Martí Angelats i Ribera) #2

It will depend of the layers that you are using and it’s spacing. the basic idea is this one:

layer = Math.ceil(y * LAYER_CONSTANT);

Where LAYER_CONSTANT is a constant made of the operation <number of layers> / <screen heigh>.

Obviously the numbers above will be specific for your project.


PS: I was a bit sleepy. Jacob’s solution is way better (not even sure if mine works).

(Jacob Albano) #3

I’ve always used the following:

layer = -y;

Make sure all your objects have their visual origins at the bottom.

(Zachary Lewis) #4

Pokémon (the sprite-based ones for GameBoy) doesn’t actually have anything the player can go “behind.” It’s set up in such a way where objects are entirely contained in their 16x16 square, and objects are either in the background or in the foreground. All foreground sprites are shifted up four pixels to reinforce the perspective, but they will never overlap.

pkmn-grid.png640x576 98.2 KB

Also, I made a thing awhile back that may be relevant to your interests.

(Hussein Tammam) #5

Wow thanks for the quick replies. About @jacobalbano codelayer = -y I guess this would solve the problem of enemies and other entities overlapping so thanks for that! But what I was really asking about was being able to walk behind wall tiles. For this to work I’d have to create an entity for every single wall tile. @zachwlewis The main char is going to be 2-3 tiles high so I cant do it like pokemon sadly. Its pretty interesting how its done though. Thanks for the link too, Its already helped me with something believe it or not :stuck_out_tongue:. Hmmm, since the hitboxes are on the bottom of the sprites maybe i can check if im on a wall tile and change its depth accordingly? Since the sprite wont ever collide with the wall from down

(Jacob Albano) #6

You can load your tilemaps in slices. Instead of having one tilemap for the whole screen, make n of them where n = number of rows in your original tilemap, and each tilemap is only one row high.

(rostok) #7

Don’t worry about entity for every wall or object. FP can handle a lot and I tested it for isometric view. For static objects you set the layer only once, there’s no need to update them. You only change it for moving objects.

(Jacob Albano) #8

This is a good point. You should still use a grid for collision, though, as the performance hit for using lots of objects for rendering is much lower than using lots of objects for collision.

(Hussein Tammam) #9

@rostok so you created an entity with the single wall tile graphic for each wall ? I was a bit hesitant to try that approach at first but this is reassuring. That seems like the best way to do it :smiley:. Also, I am using a collision grid for the level. Thanks for the help, I’ll keep you posted.

(rostok) #10

Yes, every entity for every wall. I get 30fps at i7 with over 1k entities. Floor is made of 1024x1024 large tiles. However for collisions I use my own system based on quadtree and polygon vs segment intersection because I wanted player to slide along the walls. I have no idea how the Flashpunk’s grid collision works but surely iterating through every entity may result in poor perfomance. If the world is quite large you could solve entities vs static objects collisions with either pixel lookup or maybe by integrating with Box2D. But this really depends on the size of the world, and how does it look like.

(Hussein Tammam) #11

I CAN WALK BEHIND WALLS!! Thanks for the help everyone. I’ve decided to just treat walls as regular entities and sort them by their Y-axis. I’m still using a grid for collision so nothing has changed in that regard. It works great, and I guess simplicity was the order of the day :smiley:. This is solved I presume?