Как создать гексагональное игровое поле

Разделение игрового поля на шестиугольники предполагает специальную подготовку карты к игре. Это усложняет процесс адаптации игры к конкретной задаче (новому человеку сложнее организовать сценарий и партию "на коленке"), но отказ от чёткой "географии" боевого взаимодействия кажется неприемлемым. Исходя из этого, я пока вижу четыре способа создать для игры материальную карту.
1. В графическом редакторе наложить гексагональный слой с прозрачным фоном на готовую карту местности, по которой предполагается играть. Затем распечатать: можно в цвете, можно в серых тонах, можно сразу на лист необходимого размера, можно с цифровой "порезкой" на A4, которые затем будут склеены. Чёрно-белую распечатку можно расцветить карандашами или фломастерами, в эстетических ли целях или для выделения значимых в игровой модели элементов ландшафта.
Здесь вложены:
— использованный мной исходный файл с гексагональной сеткой на прозрачном фоне (hexes.png),
— пример готовой чужой карты A2, подходящей для сценария: Рохан конца Третьй Эпохи (original.jpg),
— файл GIMP, где осветлённый ч/б-вариант этой карты совмещён со слоем гексагональной сетки, полученной из hexes.png самоналожением и истончением (rohan_hex.xcf) — в этом файле можно легко заменить слой "подложки", поставив другую интересующую карту, и сдвинуть гексы для наилучшего покрытия,
— фотография карты, распечатанной на 4 листа A4, склеенной и раскрашенной.
Плюсы:
+ если сценарий способен заинтересовать игроков, то готовые карты местности наверняка уже существуют; при наличии готового инструмента (файла GIMP со слоем гексов) карта-для-партии создаётся очень легко и быстро,
+ готовые карты бывают красивы и часто радуют узнаваемостью.
Минусы:
— к чужой карте сетку гексов обычно нельзя подогнать идеально, т.к. границы ладшафтов будут проходить посередине того или иного гекса, реки и дороги — по их рёбрам и т.д.; это может потребовать дополнительных усилий для чёткой маркировки игротехнически важных элементов карты на распечатке, что требует времени,
— на цветной карте ручная маркировка затруднена, а машинная может оказаться дольше,
— тогда как ч/б-карта, маркированная от руки, теряет глянец; впрочем, взамен игра обретает очарование самостоятельности, объединения игроков совместным творчеством,
— готовые чужие карты зачастую защищены авторским правом, что препятствует широкому распространению сценариев, чьи материалы реализованы таким образом.

2. Распечатать гексагональную сетку на лист прозрачного пластика A3 или A2. Класть поверх готовой карты, не предназначавшейся для игры, закреплять по краям чем-то тяжёлым — и вперёд! При необходимости размечать элементы ландшафта фломастерами, после партии — смывать.
ПОКА НЕ РЕАЛИЗОВАН.
Ожидаемые плюсы:
+ упрощает проведение партии "на коленке", сокращая этап подготовки карты,
+ готовые карты бывают красивы и часто радуют узнаваемостью.
Ожидаемые минусы:
— к чужой карте сетку гексов обычно нельзя подогнать идеально, т.к. границы ладшафтов будут проходить посередине того или иного гекса, реки и дороги — по их рёбрам и т.д.; это может потребовать дополнительных усилий для чёткой маркировки игротехнически важных элементов карты на прозрачном слое с гексами, после его расстилания поверх карты,
— такая маркировка может нарушить очарование используемой сторонней карты,
— данная система принципиально оторвана от картографической основы игры, т.е. является инструментом заядлых игроков в подобную макробоёвку, и почти бессмысленна для сценариев.

3. Распечатать гексагональную сетку на белый бумажный лист A3 или A2 — и заламинировать! Для проведения игры размечать ВСЕ картографические элементы фломастерами, после партии — смывать.
ПОКА НЕ РЕАЛИЗОВАН.
Ожидаемые плюсы:
+ ещё более упрощает проведение партии "на коленке", избавляя от необходимости добывать карту,
+ даёт огромные возможности для фантазии и совместного творчества игроков,
+ позволяет легко вносить коррективы в карту по мере развития сценария,
+ проблемы с авторским правом сведены к предельно возможному минимуму.
Ожидаемые минусы:
— нанесённые вручную кроки будут, скорее всего, не очень эстетичны,
— придуманная на ходу карта может содержать непреднамеренные ошибки баланса,
— при ручной отрисовке карты с образца возможны случайные ошибки,
— хотя такой метод годится для сценариев, применять его будут только заядлые игроки, уже обзаведшиеся ранее подобным "шаблоном карты".

4. Подготовить карту в одной из специальных программ, предназначенных для генерации или составления гексагональных карт — например, в редакторах пользовательских карт для «Panzer General» или «Битвы за Веснот», или в программе RPG Manager. Затем сохранить исходник и экспортировать графическим файлом. Распечатать.
Приложен чуточку недоделанный аналог карты Рохана из верхних записей, сделанный в редакторе "Битвы за Веснот" (Rohan_32x24.txt), а также скриншот с этой картой, куда от руки, тупо в графическом редакторе, добавлены реки.
ТЕСТИРУЕТСЯ, ПОКА НЕ ВПОЛНЕ РЕАЛИЗОВАН.
Ожидаемые плюсы:
+ идеальное соответствие замыслу: все ландшафтные и декоративные элементы будут соответствовать гексагональной структуре и легко узнаваться игроками,
+ неудобные особенности базовой географии используемого сюжета легко подогнать под задуманные сценарные задачи,
+ можно придумывать собственные сценарии, насколько достанет фантазии,
+ цифровой эталон карты легко изменять, внося коррективы по мере развития сценария; впрочем, распечатки всё равно устаревают,
+ идеально подходит для распространения сценариев,
+ карты будут выглядеть единообразно и по-своему стильно,
+ узнавание знакомой географии в "игрушечной" карте радует некоторых игроков,
+ при использовании конструктора карт со свободно лицензированной графикой проблемы с авторским правом сводятся к достижимому минимуму.
Ожидаемые минусы:
— карты станут в чём-то похожи друг на друга, своеобразие каждой в отдельности уменьшится,
— возможности ограничены используемым инструментом. Так, в RPG Manager не удаётся задать размер карты, в целом неудобно работать и некрасивая графика (хотя последнее, кажется, можно исправить), в "Битве за Веснот" нет рек и дорог, проходящих линиями сквозь гексы иных ландшафтов (на картинке снизу реки дорисованы в GIMP'е), редакторы пользовательских карт для Panzer General пока не найдены (хотя наверняка существуют), графика в них почти наверняка несвободная, а "волшебных" или архаичных элементов (даже замков) в ней нет вовсе.

Другие перспективные инструменты для отрисовки карт на компьютере.
FreeCiv Editor — возможно, с набором тайлов Amplio2Hexbig:
http://civland.org/forum/viewtopic.php?f=33&t=389
http://freeciv.wikia.com/wiki/Utilities
. Неясно, не является ли графика lgeneral тупо передранной из Panzer General.


Кисти для фотошопа. Специально для рисования карт. https://yadi.sk/d/Xwj_S982qGWmr
Позже думаю свои сделать, чтобы там было достаточно элементов для нарисовки нормальной карты. Хотя и этого может быть достаточно.
UPD: Для Gimp тоже наверное сделаю.


Первая сыгранная партия (13 марта 2016) послужила неплохим альфа-тестированием правил, материального воплощения игры и использованного сценария.
Карта, склеенная из четырёх листов A4, оказывается неровной: она топорщится и вспучивается в разных местах, что делает положение фишек неустойчивым. Не фатально, однако неудобно. Возможно, проблему способны решить
— фишки с более тяжёлым основанием,
— выравнивание такой карты с помощью пресса, проглаживания утюгом или иных средств,
— печать карты на один лист необходимого размера.

16,5-17 мм, толщину
1 мм. Стыкуется либо в A2 (19-20 гексов на 16), либо в "полосу" (32 гекса на 9-10).

Александр, недавно нашёл эти и ещё массу подобных кистей на ДевиантАрте. Видимо, скоро положу в документы группы, потом дам ссылку здесь. А пока — обнаружил ещё один ресурс, очень интересный, с инструкциями, советами, заготовками.
. и два наиболее любопытных, кажется, из его подразделов:

Отрисовал карту Белерианда в редакторе «Битвы за Веснот». Целевым сценарием является оборона Рубежа Майдроса в Битве Пламени, поэтому требовалось включить Нан-Дунгортеб и земли Амрода и Амраса — что задало примерную область отображения. Как можно видеть на приложенном файле East_Beleriand_Source_with_20x32_hex_ref.png, где на Восточный Белерианд накинута сеть гексов 20×32, подобная карта оказывается слишком вытянута с запада на восток; этого можно избежать, либо включая совсем уж лишние области на юге и севере, либо сокращая протяжённость маловажных в сюжете областей (тем самым меняя пропорции). Здесь сильном у сокращению подверглись Дориат с Дортонионом, и слабому — Таргелион с Лотланном.
В файле *.xcf — исходник GIMP, где гексагональная сетка находится в отдельном слое.

Набросав в «Весноте» предварительную карту и распечатав её для пробы на лист A4, я убедился в том, что подозревал давно: плитка местности в игре состоит не из ПРАВИЛЬНЫХ шестиугольников. Нет, там гексы вписываются в квадрат 72×72, то есть растянуты по вертикали. На экране это не создаёт никаких проблем, а вот на бумаге, вокруг которой игроки сидят с разных сторон, и по которой перемещаются реальные фишки, это неудобно. Рекомендуется, получив из программы «скриншот всей карты», растянуть его по горизонтали, не трогая вертикаль, в 2/sqrt(3) раза (примерно в 1,1547 раз). Графика «Веснота» вполне выдержит такое насилие, а гексы станут правильными.
Далее, печать полученной «растянутой» карты на лист A4 показала, что взятое изначально соотношение сетки в 20×32 было неверным: на лист стандартного размера можно запихнуть ещё 2 столбца гексов, т.е. правильно было делать карту 20×34. Один «столбец» я добавил к Нан-Дунгортеб, чтобы исключить пересечение его конницей за один ход, другой — к Химладу, который в начале получился неоправданно узким. Связана эта узость, вероятно, со сложностью адекватной трансляции карты с обилием рек в «Веснот» как он есть — рисовать реки приходится отдельными гексами.
И вот что получилось (файл *.map — исходный текстовый файл с картой в формате «Веснота» версии 1.8 и выше, *.png — результирующие рисунки, с явным отображением сетки гексов и без). Ряд элементов карты включён в основном для красоты, маркировки регионов и локаций или для информации, и не может нести технической нагрузки в нынешних правилах (например, разный вид лесов в разных местах). Думаю, это не создаст проблем, а только поможет вролингу.
Двергский город Как-Бы-Белегост изображён на месте горы Долмед. Думаю, такая условность тоже простительна. Направление торгового пути двергов в Дориат за Сарн Атрад нарисовано произвольно, методом «пол-палец-потолок». Северная дорога (к Химрингу) и мост через Эсгалдуин упоминаются и частично отрисованы в XI-м томе «Истории Среднеземья» — «Война Самоцветов».
Печатать такую карту рекомендуется на лист A1, чтобы гексы имели ребро длиной 17 мм.
Распечатал в copy.spb.ru на лист A1, матовую бумагу 180 гр/м^2 (обошлось в
690 RUR). Среди требований там были разрешение 720 dpi и общий размер на 2 мм больше целевого размера (то есть больше A1) по каждой из четырёх сторон. Основное увеличение произвёл в GIMP'е плагином Resynthesizer с сохранением пропорций — так, чтобы ни длина, ни ширина не превышали целевых значений. После этого потребовалась «доводка» до точного размера 23953×16951 пикселей с [незначительным] нарушением пропорций — обычными механизмами Scale Image. Результирующая картинка PNG весила что-то между 200 и 300 Мб.
Русские Блоги
Рисование гексагональной сетки местности в игре SLG
Основной работой этой статьи является рисование гексагональных сеток, которые можно использовать для создания карт.
Давайте посмотрим на эту картинку:

как показано на рисунке. Шестиугольник имеет 6 направлений и 6 вершин. В то же время кратчайшее расстояние от центральной точки до стороны определяется как внутренний радиус, а расстояние от центральной точки до вершины определяется как внешний радиус.
Шестиугольник можно разделить на 6 равносторонних треугольников, поэтому легко получить:

определяет длину стороны (то есть внешнего диаметра) шестиугольника в игре как 1
Реализация кода класса HexMetrics:
Код при рисовании треугольника:
Просто повесь на пустой предмет в единстве. Вы можете создать следующую диаграмму:

Далее стоит построить сетку карты:
Из рисунка выше мы видим следующие правила:
2. Два ряда шестиугольников с разницей в 1,5 внешних диаметра по ординате
3. Шестиугольник с нечетным числом столбцов будет смещен на 1 внутренний диаметр вправо по абсциссе.
Простая генерация гексагональной (шестиугольной) сетки из центра + поворот матрицы на любой угол. Апгрейд 2019 года.
Добрый день. Недавно я столкнулся с проблемой генерации шестиугольной сетки из центра. Есть методы генерации строками. Они годны для чего-угодно. А такого метода я не нашел. Может плохо искал, кто знает. На форуме мне предложили три кривых решения:
1. Костыли (вариант, который самый плохой).
2. Генерация построчно и выкидывание ненужного. В принципе самое правильное решение, но увы, мне нужно чтобы именно из центра. Потом удобно добавлять нужные ячейки будет.
3. Косые координаты. Это сложная мегажесть, на которую можно убить тучу времени. Я ее не смог осилить.
А теперь, перейдем к нашему алгоритму.
Суть на пальцах
Нам нужно получить ячеистую структуру аля эта.

Первым шагом будет генерация первого, центрального гексагона.

Если наш зритель достаточно прозорлив, то он заметит, что прилегающие по сторонам ячейки образуют оси матрицы.

С первым рядом проблем не возникнет, если знать радиус и угол, то все шестиугольники лягут как надо. Проблемы идут со вторым рядом. Некоторые ячейки не будут лежать где надо. А причина в следующем. В нашей структуре, есть периодичность. Но она не круговая, а гексагональная. Просто в первом ряду они сходятся.

На рисунке видно, что центры шестиугольников лежать и на окружности, и на матричном шестиугольнике. Однако на втором ряду проблема видна четко.

Видно, что на лишь осевые шестиугольники (зеленые) лежат на окружности. Центры остальных смещены к центру и лежат на матричном шестиугольнике. Поэтому, через радиальную симметрию такую сетку не задать.
Отсюда следует следующее решение.
Строим сначала лишь осевые шестиугольники.
Затем вычисляем векторы. На рисунке указано направление векторов. Оно может быть обратным.

Но нам нужен не этот вектор. Точнее не он сам, а его часть.

Нам нужен синий вектор. Это смещение, которое прибавляется к осевому шестиугольнику для получения точных координат. Желтый вектор делится на число частей, равное количество шестиугольников между осевыми шестиугольниками + 1 (или номер слоя).
После этого, можно генерировать сколь угодно большие матрицы из центра.
Алгоритм-часть
А теперь приведу код, этого безобразия. Я программировал на Xors3D, но думаю, что кому надо, тот поймет как эта штука работает (тем более, код простой, а суть объяснил выше). Нам нужна всего одна функция – функция создания ячейки.
Вот ее код.
X#, Z# — координаты центра
Order% — порядок создаваемого слоя
CellRadius – расстояние между шестиугольниками
Limit% = 6 – количество осевых шестиугольников.
If Order = 0 Then Limit = 1 – если слой первый, то шестиугольник 1.
For i = 0 To Limit-1 — создаем осевые шестиугольники
Angle# = 360/Limit*i – вычисляем угол для каждого осевого шестиугольника
Cell.Cell = New Cell – создаем шестиугольник
Cell\X = X + CellRadius*Sin(Angle)*Order
Cell\Z = Z + CellRadius*Cos(Angle)*Order — задаем его координаты
Cell\Sprite = xCopyEntity(Cell_Image) – это спрайт, не важно для кода
xSpriteViewMode Cell\Sprite,2
xRotateEntity Cell\Sprite,90,0,0
xPositionEntity Cell\Sprite,Cell\X,0,Cell\Z – задаем позицию
;Vector calculating
If Order > 0 Then – вычисляем вектора, если ряд не нулевой (где центральный гексагон)
Vector(i,0) =((CellRadius*Sin(Angle+60)*Order-CellRadius*Sin(Angle)*Order))/(Order) – 0 = X, первая координата вектора
Vector(i,1) =((CellRadius*Cos(Angle+60)*Order-CellRadius*Cos(Angle)*Order))/(Order) – 1 = Z, вторая координата вектора
End If
Next
For i = 0 To Limit-1 – строим остальные шестиугольники
Angle# = 360/Limit*i – угол осевого шестиугольника
For j = 0 To Order-2 – строим шестиугольники в каждой стороне.
Cell.Cell = New Cell – новый шестиугольник
Cell\X = X + CellRadius*Sin(Angle)*Order + Vector(i,0)*(j+1)
Cell\Z = Z + CellRadius*Cos(Angle)*Order + Vector(i,1)*(j+1) –добавляем к координатам смещение (вектор) умноженный на порядок добавляемого шестиугольника (в 3 и последующих рядах их больше 1)
Cell\Sprite = xCopyEntity(Cell_Image)
xSpriteViewMode Cell\Sprite,2
xRotateEntity Cell\Sprite,90,0,0
xPositionEntity Cell\Sprite,Cell\X,0,Cell\Z
Next
Next
Что имеем на выходе:

Апгрейд 1.0 — Поворот на любой угол матрицы
Могут возникнуть ситуации, когда нашу гексагональную сетку надо куда-то примкнуть под нужным углом. Я подумал над этим, и модернизовал функцию — теперь можно поворачивать всю матрицу на произвольный угол!
Итак, код:
Важные отличия:
Function CreateCell(X#,Z#,Order%,AddAngle%) — появился новый аргумент, это и есть произвольный угол — AddAngle.
Angle# = 360/Limit*i+AddAngle — добавляем смещение для расчета углов и векторов.
xRotateEntity Cell\Sprite,90,-AddAngle,0 — поворот спрайта вокруг вертикальной оси в противоположную сторону.
Что имеем на выходе:
17 градусов.

30 градусов.

10 градусов.

|