Update: Karten-Rendering-Algorithmus korrigiert, weitere Abbildungen hinzugefügt, Formatierung geändert.
Vielleicht kann der Vorteil der "Zick-Zack" -Technik zum Zuordnen der Kacheln zum Bildschirm darin bestehen, dass sich die Kacheln xund yKoordinaten auf der vertikalen und horizontalen Achse befinden.
Ansatz "Zeichnen in einem Diamanten":
Durch Zeichnen einer isometrischen Karte mit "Zeichnen in einem Diamanten", was sich meines Erachtens darauf bezieht, die Karte nur mit einer verschachtelten forSchleife über dem zweidimensionalen Array zu rendern, wie in diesem Beispiel:
tile_map[][] = [[...],...]
for (cellY = 0; cellY < tile_map.size; cellY++):
for (cellX = 0; cellX < tile_map[cellY].size cellX++):
draw(
tile_map[cellX][cellY],
screenX = (cellX * tile_width / 2) + (cellY * tile_width / 2)
screenY = (cellY * tile_height / 2) - (cellX * tile_height / 2)
)
Vorteil:
Der Vorteil des Ansatzes besteht darin, dass es sich um eine einfache verschachtelte forSchleife mit ziemlich einfacher Logik handelt, die in allen Kacheln konsistent funktioniert.
Nachteil:
Ein Nachteil dieses Ansatzes besteht darin, dass die xund yKoordinaten der Kacheln auf der Karte in diagonalen Linien zunehmen, was es möglicherweise schwieriger macht, die Position auf dem Bildschirm visuell auf die als Array dargestellte Karte abzubilden:
Die Implementierung des obigen Beispielcodes wird jedoch eine Gefahr darstellen. Die Renderreihenfolge führt dazu, dass Kacheln, die sich hinter bestimmten Kacheln befinden sollen, über die Kacheln vor ihnen gezeichnet werden:
Um dieses Problem zu forbeheben, muss die Reihenfolge der inneren Schleife umgekehrt werden - beginnend mit dem höchsten Wert und gerendert in Richtung des niedrigeren Werts:
tile_map[][] = [[...],...]
for (i = 0; i < tile_map.size; i++):
for (j = tile_map[i].size; j >= 0; j--): // Changed loop condition here.
draw(
tile_map[i][j],
x = (j * tile_width / 2) + (i * tile_width / 2)
y = (i * tile_height / 2) - (j * tile_height / 2)
)
Mit dem obigen Fix sollte das Rendern der Karte korrigiert werden:
"Zick-Zack" -Ansatz:
Vorteil:
Möglicherweise besteht der Vorteil des "Zick-Zack" -Ansatzes darin, dass die gerenderte Karte vertikal etwas kompakter erscheint als der "Diamant" -Ansatz:
Nachteil:
Beim Versuch, die Zick-Zack-Technik zu implementieren, kann der Nachteil sein, dass es etwas schwieriger ist, den Rendering-Code zu schreiben, da er nicht so einfach wie eine verschachtelte forSchleife über jedes Element in einem Array geschrieben werden kann:
tile_map[][] = [[...],...]
for (i = 0; i < tile_map.size; i++):
if i is odd:
offset_x = tile_width / 2
else:
offset_x = 0
for (j = 0; j < tile_map[i].size; j++):
draw(
tile_map[i][j],
x = (j * tile_width) + offset_x,
y = i * tile_height / 2
)
Es kann auch etwas schwierig sein, die Koordinate einer Kachel zu ermitteln, da die Renderreihenfolge versetzt ist:
Hinweis: Die in dieser Antwort enthaltenen Abbildungen wurden mit einer Java-Implementierung des dargestellten Kachel-Rendering-Codes mit dem folgenden intArray als Karte erstellt:
tileMap = new int[][] {
{0, 1, 2, 3},
{3, 2, 1, 0},
{0, 0, 1, 1},
{2, 2, 3, 3}
};
Die Kachelbilder sind:
tileImage[0] -> Eine Kiste mit einer Kiste darin.tileImage[1] -> Eine Blackbox.tileImage[2] -> Eine weiße Kiste.tileImage[3] -> Eine Kiste mit einem hohen grauen Gegenstand.
Ein Hinweis zu Fliesenbreiten und -höhen
Die Variablen tile_widthund tile_heightdie in den obigen Code Beispielen verwendet werden , beziehen sich auf die Breite und die Höhe der Bodenfliese in dem Bild , die die Fliese:
Die Verwendung der Bildabmessungen funktioniert, solange die Bildabmessungen und die Kachelabmessungen übereinstimmen. Andernfalls könnte die Kachelkarte mit Lücken zwischen den Kacheln gerendert werden.