Обновление: исправлен алгоритм рендеринга карты, добавлено больше иллюстраций, изменено форматирование.
Возможно, преимущество техники зигзага для отображения тайлов на экране можно сказать, что координаты x
и y
тайла находятся на вертикальной и горизонтальной осях.
Подход "Рисование в алмазе":
Рисуя изометрическую карту, используя «рисование в ромбе», что, как я полагаю, относится только к визуализации карты с использованием вложенного for
-попа над двумерным массивом, такого как этот пример:
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)
)
Преимущество:
Преимущество этого подхода заключается в том, что он представляет собой простой вложенный for
-петл с довольно простой логикой, которая работает последовательно на всех тайлах.
Недостатки:
Недостатком этого подхода является то, что координаты плиток на карте x
и y
будут увеличиваться в виде диагональных линий, что может затруднить визуальное сопоставление местоположения на экране с картой, представленной в виде массив:
Однако при реализации приведенного выше примера кода будет ловушка - порядок рендеринга приведет к тому, что плитки, которые должны находиться за определенными плитками, будут нарисованы поверх плиток впереди:
Чтобы исправить эту проблему, внутренний порядок for
-циклов должен быть обращен в обратном направлении - начиная с самого высокого значения и рендерившись к более низкому значению:
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)
)
С помощью вышеуказанного исправления рендеринг карты должен быть исправлен:
Подход "зигзаг":
Преимущество:
Возможно, преимущество подхода "зигзаг" в том, что визуализированная карта может показаться немного более вертикально компактной, чем подход "алмаз":
Неудобство:
Из-за попытки реализовать технику зигзага, недостатком может быть то, что немного сложнее написать код рендеринга, потому что он не может быть написан так просто, как вложенный for
-попад над каждым элементом в массиве. :
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
)
Кроме того, может быть немного трудно определить координату тайла из-за смещенного характера порядка рендеринга:
Примечание. Иллюстрации, включенные в этот ответ, были созданы с использованием Java-реализации представленного кода рендеринга плитки со следующим массивом int
в качестве карты:
tileMap = new int[][] {
{0, 1, 2, 3},
{3, 2, 1, 0},
{0, 0, 1, 1},
{2, 2, 3, 3}
};
Изображения плитки:
tileImage[0] ->
Коробка с коробкой внутри.
tileImage[1] ->
Черный ящик.
tileImage[2] ->
Белая коробка.
tileImage[3] ->
Коробка с высоким серым предметом внутри.
Примечание по ширине и высоте плитки
Переменные tile_width
и tile_height
, которые используются в приведенных выше примерах кода, относятся к ширине и высоте основного фрагмента изображения, представляющего фрагмент:
Использование размеров изображения будет работать до тех пор, пока размеры изображения и размеры плитки совпадают. В противном случае карта тайлов может быть визуализирована с промежутками между тайлами.