I have a little problem while displaying isometric tiles in my school game.
The fact is that I suppose everything is ok with my code…

Here is how it’s organised:

• architecture: MVC + ECS
• everything is displayed in my render method of the GameView class
• I use bases and vetors to make conversions between the two bases (orthogonal one and isometric one)

Here is the code:

public void render() {
    try {
        final Entity[] entities = this.controller.getEntities();

        // Sort entities by isometric depth
        Arrays.sort(entities, (e1, e2) -> {
            PositionComponent p1 = e1.getComponent(PositionComponent.class);
            PositionComponent p2 = e2.getComponent(PositionComponent.class);

            // Calculate depth as the sum of cartesian x + y
            double depth1 = p1.getX() + p1.getY();
            double depth2 = p2.getX() + p2.getY();

            // Primary sorting criterion: depth
            int result = Double.compare(depth1, depth2);

            // Secondary sorting: cartesian Y coordinate
            if (result == 0) {
                result = Double.compare(p1.getY(), p2.getY());
            }

            // Tertiary sorting: cartesian X coordinate
            if (result == 0) {
                result = Double.compare(p1.getX(), p2.getX());
            }

            // Fallback sorting: hashCode
            if (result == 0) {
                result = Integer.compare(e1.hashCode(), e2.hashCode());
            }

            return result;
        });

        for (Entity entity : entities) {
            // Get position component
            PositionComponent position = entity.getComponent(PositionComponent.class);

            // Convert to isometric coordinates
            Vector isoPos = this.gameBase.mulByVect(
                new Vector2D(position.getX(), position.getY())
            );

            // Debug: print isometric position
            // System.out.println("Isometric Position: " + isoPos);

            // Get texture component
            ImageIcon image = entity.getComponent(TextureComponent.class).getTexture();

            // Create label for the entity
            JLabel label = new JLabel(image);

            // Set bounds based on isometric position
            label.setBounds(
                (int) isoPos.getEntry(0),
                (int) isoPos.getEntry(1),
                image.getIconWidth(),
                image.getIconHeight()
            );

            this.panel.add(label);
        }

        // Revalidate and repaint after adding all entities
        this.panel.revalidate();
        this.panel.repaint();

    } catch (Exception e) {
        e.printStackTrace();
    }
}

However, the tiles are not displaying well. In fact the farthest one are displayed after the closest so it seems flipped…

Do you have any idea ?

Of course if needed, feel free to ask as many questions as you want!

Thanks a lot!

EDIT: It works !!!

Well, there was 2 problems, the first one was the continuous display of my tiles displaying them one over the other one, so even if the sort was working, the farthest tiles were displayed on the closest…
Second, the sort wasn’t working, so I just sort by Y then by X.

And here it is !!!

public void render() {
    try {
        final Entity[] entities = this.controller.getEntities();

        // Sort entities by isometric depth
        Arrays.sort(entities, (e1, e2) -> {
            PositionComponent p1 = e1.getComponent(PositionComponent.class);
            PositionComponent p2 = e2.getComponent(PositionComponent.class);

            int result = -Double.compare(p1.getY(), p2.getY());

            if (result == 0) {
                result = -Double.compare(p1.getX(), p2.getX());
            }

            // Fallback sorting: hashCode
            if (result == 0) {
                result = Integer.compare(e1.hashCode(), e2.hashCode());
            }

            return result;
        });

        this.panel.removeAll();

        for (int i = 0; i < entities.length; i++) {
            Entity entity = entities[i];

            // Get position component
            PositionComponent position = entity.getComponent(PositionComponent.class);

            // Convert to isometric coordinates
            Vector isoPos = this.gameBase.mulByVect(
                new Vector2D(position.getX(), position.getY())
            );
            
            // Get texture component
            ImageIcon image = entity.getComponent(TextureComponent.class).getTexture();

            // Create label for the entity
            JLabel label = new JLabel(image);

            // Set bounds based on isometric position
            label.setBounds(
                (int) isoPos.getEntry(0),
                (int) isoPos.getEntry(1),
                image.getIconWidth(),
                image.getIconHeight()
            );

            this.panel.add(label);
        }

        // Revalidate and repaint after adding all entities
        this.panel.revalidate();
        this.panel.repaint();
    } catch (Exception e) {
        e.printStackTrace();
    }
}