How to make Z ordering isometric objects in C3?

Not favoritedFavorited Favorited 0 favourites
  • 10 posts
From the Asset Store
[C2] [C3] Support C3 build service and Android 14
  • I'm making an isometric game and I'm stuck with the problem of sorting objects by the z-axis. The game will allow you to move objects and I need them to overlap each other correctly. How do I do this?

    I searched the forum for an answer, but most of the threads no longer have links to examples that work.

    dropbox.com/scl/fi/sddltg8u5xkk1qu94xoby/test.c3p

  • You watched this topic, there are live links.

    construct.net/en/forum/construct-3/how-do-i-8/set-player-move-behind-front-185721

  • You watched this topic, there are live links.

    https://www.construct.net/en/forum/construct-3/how-do-i-8/set-player-move-behind-front-185721

    This is not suitable for sorting rectangular isometric objects. In the gif you can see why

  • Hmm that's actually a tough issue given that the default of sorting at the Y position is not gonna cut it.

    Perhaps the easiest solution for the fences specifically would be to split it up into individual sprites (and use hierarchies to stich them back together), so that sorting by Y position would approximate more closely to what you'd expect.

    I can imagine there could be a more involved solution where you figure out the draw order based on some hidden top-down representation of the scene.

    Or it's possible that you utilze the 3D capabilities of Construct. If you imagine the scene as isometric 3D, the fence would be on the side of the cube object, and the sorting is handled by the 3D magic.

  • With iso if the objects are all the same size you can just y sort by the bottom corner. The objects could also vary by their z height and that would still work. So the idea of breaking the long objects into chunks is an idea.

    To sort different sized objects you won’t be able to sort two objects based on one point on each object anymore. If it helps, try the case of just two objects, and figure out which should be in front of the other.

    You can do that by comparing the iso positions of the sides of the base. Or approximating the object shapes by a line from the left and right corners and calculating which should be in front of the other. Or if you want to be super deluxe you can utilize some kind of collision detection algorithm in isometric space and using the collision normal to see which should be in front of the other.

    Anyways after that you’d have a way of sorting pairs of objects. From that for each object you can make a list of other objects that they are in front of. Sorting that is called a topological sort, but basically it involves first drawing the objects that aren’t in front of anything. Then drawing the objects that are in front of only the already drawn stuff.

    Unfortunately it is possible to come up with impossible to sort cases. But in general as long as the bases of the isometric objects don’t overlap you should be fine.

    Here’s an older but useful link about isometric sorting.

    bannalia.blogspot.com/2008/02/filmation-math.html

    Just some ideas.

  • Perhaps the easiest solution for the fences specifically would be to split it up into individual sprites (and use hierarchies to stich them back together), so that sorting by Y position would approximate more closely to what you'd expect.

    cutting a long object into several parts is a bad idea. 1 object (fence) will turn into 5-6, and there can be 100 or more fences and there are still other objects.

    It may seem that this is a simple way, but it is not, there are also other problems - when draging the fence, it becomes visible that it consists of several parts, between which the distance can change (+-1px). I tried this method

  • With iso if the objects are all the same size you can just y sort by the bottom corner.

    Do you mean sort objects like this?

    Here’s an older but useful link about isometric sorting.

    https://bannalia.blogspot.com/2008/02/filmation-math.html?m=1

    It's very interesting, but difficult to understand.

  • cutting a long object into several parts is a bad idea. 1 object (fence) will turn into 5-6, and there can be 100 or more fences and there are still other objects.

    Can you snap them to the grid? That way, the fences in your video would take up 2 grid cells, and you'd only need to cut them into 2 pieces.

    I saw a similar project recently where they ended up cutting the objects using meshes and then combining them into a hierarchy.

  • Here's one of those ideas implemented. To use you just need to set the collision polygon to cover the object and set the two image points to the left and right of the base of the objects. Sorting should work fine as long as the bases of the iso objects don't overlap, and even then it seems to mostly be fine.

    dropbox.com/scl/fi/yuhfzrh8qie1u1946gzh4/iso_sort_6.29.25.capx

    The nice thing about this method is you aren't restricted to blocks aligned to the iso grid, so you can have thin walls or blocks with rotated bases.

    Keep in mind this is for if all the blocks are on the ground. aka no stacking or floating blocks. If you need those then the idea would need extending.

    Currently it just doesn't try to sort between two objects if their bases overlap. I'm kind of curious if it would work better to instead figure out how much on one side of the line or the other the object is and use that. But that's an idea for another day.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Here's one of those ideas implemented. To use you just need to set the collision polygon to cover the object and set the two image points to the left and right of the base of the objects. Sorting should work fine as long as the bases of the iso objects don't overlap, and even then it seems to mostly be fine.

    https://www.dropbox.com/scl/fi/yuhfzrh8qie1u1946gzh4/iso_sort_6.29.25.capx?rlkey=zq3x4v0kdzambky1i6gt4kla9&st=qpexssm6

    The nice thing about this method is you aren't restricted to blocks aligned to the iso grid, so you can have thin walls or blocks with rotated bases.

    Keep in mind this is for if all the blocks are on the ground. aka no stacking or floating blocks. If you need those then the idea would need extending.

    Currently it just doesn't try to sort between two objects if their bases overlap. I'm kind of curious if it would work better to instead figure out how much on one side of the line or the other the object is and use that. But that's an idea for another day.

    thank you very much, just what I needed

Jump to:
Active Users
There are 0 visitors browsing this topic (0 users and 0 guests)