Как мне раскрасить гексагональную сетку так, чтобы в ней не было соседей одного цвета?

Question

У меня есть приложение javascript, которое генерирует шестнадцатеричную сетку. Каждый гекс заострен с тремя переменными для каждой из координат куба (x, y & z). У меня также есть массив с тремя шестнадцатеричными спрайтами.

Я пробовал sprite = sprites[hex.x&3], который производит аккуратные ряды гексов. Я также попытался сместить строки в зависимости от столбца с помощью sprite = sprites[(hex.x + hex.y&3)&3], но это не сработало. В настоящее время я играю с формулой без особого успеха.

Я точно знаю, что для этого мне нужно не менее трех спрайтов, но я не могу найти способ объединить три координаты куба, чтобы показать правильный спрайт в массиве: (

Answer 1

В гекс-сетке вам понадобится три цвета, чтобы раскрасить каждый гекс так, чтобы он не совпадал с цветом соседа:

Вы были на правильном пути с вашим решением. Вместо добавления x+y вы хотите вычесть x-y. Другое изменение состоит в том, что &3 для битовых манипуляций; вы захотите %3 вместо. Однако в некоторых языках, включая Javascript, %3 может возвращать отрицательное число, поэтому вам нужно использовать ((___%3)+3)%3, чтобы сделать его положительным.

Требуемый идентификатор цвета / спрайта ((x-y)%3 + 3) % 3. Я сделал интерактивную демонстрацию , чтобы проверить это.