Help with isometric movement

I’m trying to move a sprite in a four way isometric movement, each floor tile has four variables which determines which way it can travel, I’ve got the sprite moving but he still wonders off track slightly, also he sometimes overshoots.

Has anyone got any ideas for a more precise movement?

Pic of the layout, each floor tile is 64x32

Here is my routine, I know using forces to move is not a great idea as it’s prone to overshoot

Is it following a set path or a random one?

IDK if you’re familiar with the pathfinder or pathfinder linked behavior. This example I made uses mouse clicks but it could be modified to pick a random tile. Move to it. When the destination is reached, make it choose a new tile.

If you don’t want to use it. That’s fine. I can look at your code later today. Or someone else will. Another option is using tweens.

Think of it a bit like the ghosts in pacman, I have written the routines for random movement, chase and flee and some other ai and they work well.

I just cannot get them to stay in the middle of the tiles and stop/turn exactly at the right time without a bit of creep setting in, I think my X and y ratio for the isometric movement maybe a little off so they start veering off course as I’ve tried tweens with the same results

I may need to find some kind of algorithm for the ratios, but I will have a look at your code and see if I can adapt it, the output from my ai routines just gives a direction 0,1,2 or 3.

Thanks for anything you can suggest though!

Interesting. Let me think about it when I’m at my PC. The link I posted is to a thread with 2 versions). My original project used the pathfinder to only follow the road tiles. I modified it in the one I linked to, to use 2 groups, 1 group to travel on and one to avoid. The avoid or obstacle group is only used to make sure the tiles have the right z-order. The extension doesn’t use obstacles. It just follows the quickest route between 2 objects usung the objects.

It creates a link between all of the chosen objects using a 2nd object to connect them to each other it then moves the objects to a chosen object using only the objects in group.

I found a couple of interesting sites on isometric, maybe of use if I can transfer it to gdevelop?

Very interesting. Thanks for sharing.

The converting between the 2 spaces looks fairly easy. You woud need to create 4 functions. Separate functions for x and y for converting to isometric and separate x and y functions to convert from.

TwoDToIsoX, TwoDToIsoY, IsoTo2DX, IsoTo2DY (or whatever name you want)

The other stuff like rotating on the other hand, looks more complex but doable.

1 Like

I will have a look, did have a little go but couldn’t get 8t to work, will try again

1 Like

I’m still having a problem converting this into something I can use in Gdevelop, I don’t understand the point but?

This needs to be simplified. It probably doesn’t really need the JavaScript. IDK. I have no idea how to manage the offset and I don’t really have the time to work on it. I only did this part because I was curious and I wanted to create a starting point.

All my project does is draw dots below the tiles using the conversion functions when the cursor is over the tiles. I added a few comments but I have no idea of your knowledge of JavaScript. Mine is a bit weak.

try it:


1 Like

Thanks! I will have a look

1 Like

Have only had time for a short play with this and it seems great, have placed tilles, now to move sprites in Isometric directions, cheers!

1 Like

Good to hear. When helping people, I never know the amount of experience the person has. I’m glad it’s helping.

1 Like

I don’t have a lot of programming experience but it’s fun trying, do you mind if I promote iso-to-2d around?

1 Like

You can use it however you want. It’s all good.

1 Like

Found a really good isometric primer which deals with offset, just in case your interested

1 Like

Sorry for the delay (work things), I’ve come back to this but I cannot figure out how to move say a 32 x32 sprite in an Isometric direction using the extension, I can only get it moving up, down, left and right, could you point me in the right direction (no pun intended), thanks!

How are you trying to move it? Are you basing the isometric position on a regular x,y grid? I’m not at my PC. I will be later. I never did look into how to sync the coordinate systems. Through trial and error I could probably find the right offset but I’m sure there’s probably a formula.

Anyways, what events have you tried?

Ok, I figured out the conversion and offset. I updated my project. I changed the extension to convert to ISO using an offset and tile spacing (width,height). The top tile is equivalent to 0,0 (I updated the expression for GetISOfrom2DX and GetISOfrom2DY)

I added an example to the [move] button. It draws a dot (circle) that matches the x,y of the road tiles without using the road objects x,y.

try me:


I tried adding some of the sizes and coordinates. You can compare which dots are drawn in the lower right when the cursor goes over the road tiles.

Here’s an example of adding the values to the expression with the expression builder. To keep it simple it’s the same parameters for the x and the y expressions. So, you can copy and past the X expression and change it to Y.

Example of drawing a circle

Just to be clear, the width and height aren’t the size of the tile but the size of the grid. Meaning the distance from tile to tile.

1 Like

Fantastic, cannot wait to try it out, thanks again for all your hard work on this!

1 Like

You’re welcome. This is fun. The example could probably be simpler but it’s based off of another project. I need to look at the formula to convert in the other direction and maybe incorporate the same parameters. For simplicity the offsets and spacing could probably be initialized and saved in a variable and then the expressions could be streamlined. This is still a new concept to me.

To be clear. The width and height are the spacing between iso tiles. It has nothing to do with the size of the sprite. The parameters should probably be spacing or grid. The offset parameters are the position of the first tile, 0,0. It’s the tile on the very top.

1 Like