How to approach players beeing overlapped by high isometric tiles?

Question

I'm making a browser game wich is based on PHP, MySQL and Javascript. It has an isometric world where the player can move and see other players/NPCs. But if a tile in the foreground is so high that it overlaps the tile behind it (e.g. a building or a group of trees, etc.), how to approach players beeing overlapped as well? I don't wan't players to be able to "hide" behind high tiles so that the characters of other players or the own character is not visible.

I thought about involving transparency by "making a sandwich" with a tile layer at the bottom, then the player and then the same tile layer on top, but slightly transparent. But when I tried it, the player looked like some king of ghost floating around and it was not clear where the player stands exactly.

Other games (like Age of Empires) managed this by displaying overlapped characters as an outline but this is really complicated/CPU-intensive using PHP, as far as I know.

I have no idea on how to approach this problem. Any ideas?

Answer 1

I don't think displaying an outline of your character will be CPU intensive (unless you have thousands of players to display).

You just need to have 2 sets of images for your characters: 1 with only the outline (O sprite) and one with the rest of the character (C sprite).

If you're having high tiles, you probably already draw them in the correct order (using z-order, the tiles in the background first, and the ones in the foreground last).

You just have to draw the C sprite in the correct z-order (which means it may be hidden by a high tile in front of it), and the O sprite after you have drawn all the tiles (which means it will always be visible).

You mention doing this in PHP; I take it that you're working in a turn based game, and you're generating an image on the server every time something changes.

While it's not critical, you may consider rendering the scene in Javascript on the client side; that will greatly reduce the bandwidth used by your game (each tile is only sent once) and displaying an isometric world in Javascript is not that difficult.