Tilemap character ignoring restrictions

I made some experiments with tile maps and maybe I'm doing something wrong.

I used the tile-map of the example from your website, but replaced the sprite.
Everything works until I carefully press only one of the direction keys.
The only problem is that the sprite ignores the automaticRotations = false.

This turns out in a blocking situation when the sprite is close to a collision tile and it rotates diagonally (ignoring the allowDiagonal = false).

The collision box at that point overlaps a collision tile and the sprite does no more respond to movement keys.

Any suggestion? 

All 6 Comments


I tried a similar setup but could not reproduce the problem (the sprite does not rotate and it does not get stuck).

Do you want to share your project so I can have a look?


I thought I added the zip file as attachment.

Here's the link




It looks like that character has 2 TilemapCharacter behaviors. The properties in the second one override the properties in the first one. I think you probably want to delete the second one, it may have been added by mistake.



I feel very smart now :-))))))

It works... of course


Hi Gio.

Another issue. I'm surely missing something, but apparently I followed the right way... apparently.

http://www.lsf-lab.com/test_dungeon_tiles.zip (this is the link to the new version)

It's a turn based game, so the sprites move from one cell to another.

When I press D the sprite goes correctly to the right.

When I press C it shoud move diagonally. From the starting position I can understand that there's a collision and the movement goes around the corner (though in this case I would prefer that setDestination returns false). Unfortunately this happens also when there are no walls to avoid.

The sprite has allowDiagonal = true, but allowInput = false because I don't want a real time movement. BTW, if I set allowInput = true, it actually moves diagonally when I press down+right for example.

Here's the onKeyUp event

var bh = this.getBehavior('TilemapCharacter');
var {x,y} = wade.tilemap.getTileCoordinates(this.getPosition().x, this.getPosition().y);
console.log ({x,y});
if (data.keyName=='d') {
    console.log(bh.setDestination({x: x+1, y: y}));
} else if (data.keyName=='c') { // diagonal
    console.log(bh.setDestination({x: x+1, y: y+1}));

I made also this experiment

var next = bh.getNextDestination();
if ('camefrom' in next) {
    if ((next.camefrom.fScore >1) || (next.camefrom.gScore>1) || (next.camefrom.hScore>1)) {

but getNextDestination can be executed only after setDestination, and clearDestination has no effect.

Is there a way to calculate the cost of movement before setDestination?

Or maybe get the path in advance, calculate the nodes and then decide to move or not.

Any idea? 




You're right, if the character is told where to go via its TilemapCharacterBehavior, it won't use diagonals. This is because of potential problems with collisions, i.e. you could easily get into a situation where you are allowed to move diagonally in terms of tilemap collisions, but the character's bounding box does not fit because of neighboring tiles being blocked.

I wouldn't recommend it, but if you want you can change this by editing the TilemapCharacter behavior. You can do this by adding a copy of the file to the scene scripts, and editing that copy. If you want to do that, line 823 of tilemapCharacter.js should be:

var path = wade.tilemap.findPath(gridStart, gridCoords, (this.allowDiagonal ? 'both' : 'top-down straight'), this.maxPathLength);

Another way to work around it, is to use the wade.tilemap.findPath function directly. Your character would not be a TilemapCharacter in this case, just a simple SceneObject. wade.tilemap.findPath gives you an array of tiles to go to, in order to reach your destination avoiding blocked tiles. The 3rd parameter should be "both" if you want to include diagonals.

You can then use this array of tiles to move your scene object, using the moveTo() function, or better yet by creating a Path. This would ignore any tilemap collisions, so you won't have any problems with tight corners.

To convert from tile coordinates to world coordinates (that you would use to build a Path, or with the moveTo function), you can use

wade.tilemap.getWorldCoordinates(tile.x, tile.y);


Post a reply
Add Attachment
Submit Reply
Login to Reply