Подготовка тайлов для пользовательского слоя карты. Битовый способ отображения тайловых карт

Что такое тайл
Вы, наверное, представляете себе, что такое тайл, но давайте все же познакомимся с ним поближе. Тайл выглядит как картинка фиксированного размера. Причем нарисованная таким образом, что при сопоставлении с другими тайлами получается единое изображение без заметных “швов”. Легче всего представить тайлы как кафель, которым облицовывают стены или полы. Самый простой тайл - квадратное изображение, симметричное по вертикали и горизонтали (вы можете видеть его на иллюстрации). Если составить эти картинки друг с другом, то получится большое полотно дерна. А если внести в эту живописную картину для разнообразия еще один вид тайла, скажем, изображающий дорогу, то можно уже составить примитивную карту.
Давайте теперь посчитаем затраты, которые от нас потребуются для создания карты размером 512x512 клеток. Допустим, что сам тайл будет размером 32x32 пикселя, тогда он будет занимать в памяти 1024 байта - 1 килобайт. После подсчетов оказывается, что простейшая карта занимает в памяти около 262 килобайт плюс память для хранения изображений самих тайлов. А вот если бы мы рисовали такую же по площади область вручную, то нам пришлось бы положить на алтарь технического прогресса 268 мегабайт (!). И это при том, что я брал для простоты режим в 256 цветов. Понятно, что даже сейчас не каждый компьютер обладает таким количеством памяти, так что тайловое строение карт используется в подавляющем большинстве двухмерных и в достаточном количестве трехмерных игр.
Прямоугольные и квадратные тайлы хороши для представления вида с высоты птичьего полета, но существует и другой вид проекции, называемый изометрией. Он используется, когда надо дать ощущение объема, глубины, сделать псевдо-3D . Отсюда изометрические системы иногда называют 2.5D. В чем же здесь суть? Теперь тайл будет выглядеть повернутым одним углом к зрителю и как бы уходящим вглубь (посмотрите на иллюстрацию). Двухмерная по своей сути картинка обретает третье измерение. При этом размеры квадрата (тайла) определяются следующим образом:
1. Длина - от самой левой до самой правой точки изображения.
2. Ширина - от самой “дальней” до самой “ближней” точки к зрителю.
3. Высота - "толщина" тайла.
Для создания эффекта объема ширина должны быть меньше длины примерно в два раза. Экспериментируя с эти отношением, вы как бы вертите "плиткой" в трехмерном пространстве, выбирая нужную проекцию. Для этих целей полезно использовать какой-либо аналог 3D-студии. Создайте там плитку, выберите ее положение, а затем измерьте стороны и получившиеся соотношения.
Но как же теперь нарисовать такой тайл на экране? Ведь обычные функции рисования привыкли к тому, что им дают прямоугольную область для вывода, с чем они прекрасно справляются. Задача эта решается с помощью масок. На иллюстрации вы увидите, что контуры плитки попадают в белую область, а то, что остается за бортом, окрашивается в черный цвет и формирует прямоугольник. Получается принцип трафарета: изображение накладывается на маску и на “холст”, а проходят только те точки, которые попадают в белый цвет. Даже стандартные функции рисования Windows обучены вытворять такие штуки, не говоря уже о функциях DirectX. При этом использование масок позволяет делать и другие эффекты. Например, вы можете нарисовать только шапку тайла, отбросив его высоту. Или сделать разные участки травы с использованием только одной картинки. Если создать маску, состоящую сплошь из дырок, и с ее помощью отобразить тайл с травой на месте уже существующего тайла другого типа, у нас получится плавный переход от одной поверхности к другой. Подобный прием можно применять во множестве случаев, а “дырявые” маски генерировать случайным образом. Тогда никто и не догадается, что у вас не пререндеренный пейзаж. Получается своеобразное мультитекстурирование: когда на один участок накладываются два взаимно прозрачных изображения. Правда, это отнимает достаточное количество компьютерного времени.
В самом простом случае высота тайла равна нулю и не просчитывается. Однако если мы будем использовать только такие "кирпичики", то мы добьемся создания в лучшем случае приятной полянки. Используя различающиеся высоты, мы добьемся создания более реалистичного пейзажа, со стенками и пригорками. Конечно, выводить такие “кирпичики” на экран будет сложнее. Теперь мы должны познакомиться с понятием базовой линии тайла.
Базовая линия - это место, в котором тайл соприкасается с “землей”. На картинке они выделены розовым цветом. Базовая линия может проходить в любом месте на линии вертикали, ведь для стены разной величины может использоваться одно и то же изображение. Тогда на карте размещения тайлов отображаются базовые линии, а сами тайлы начинают отрисовываться из более верхнего положения.

2Dfx
Мы уже рассматривали, какие эффекты можно создавать, используя несколько тайловых слоев. В реальных играх вся карта является многослойной, как пресловутый пирог: первый слой - это земля, камни, грязь, вода и тому подобное; второй слой - всякая периферия типа деревьев, скал, столов и стульев; третий слой - объекты: люди, монстры, ключи и магические зелья.
Вы можете добавлять еще слои для вышеупомянутых эффектов, но обычно для обеспечения лучшей производительности используют четыре-пять. Скажем, четвертый слой в нашей схеме можно добавить для создания объектов, которые будут находиться выше уровня головы персонажей, например крыш домов. Вы все встречались с таким эффектом: когда герой подходит к зданию вплотную, у того вдруг исчезает крыша, и вы можете увидеть внутренности строения. Так вот, очень легко заставить тайловый движок перестать отрисовывать четвертый слой, чтобы пользователь увидел все, что скрывается под ним.
Тайловые движки, основывающие свою графику на принципе палитр, активно используют эффект ротации цветов. Пусть некая синяя гамма используется для отрисовки воды. Тогда, изменяя эту гамму или, наоборот, переставляя индексы в тайле, можно получить эффект перетекающей воды. Тот же самый фокус проходит и для других поверхностей. Скажем, в пещере тайлы, изображающие скалу, можно сделать темнее. А если вручить персонажу в руки факел и в зависимости от его позиции осветлять окружающую местность - эффект получится очень красивый. Я уже не говорю о динамической смене дня и ночи. Менеджмент палитр - очень интересный вопрос, вдобавок очень хорошо разработанный и изученный в период тотального 256-цветия, когда без палитр не обходился никто. Даже сейчас, когда цветность меньше 16 бит считается неприличной, для хранения спрайтов используются собственные форматы, основанные на все тех же палитрах.
Кстати, кто сказал, что для вывода тайлов нужно обязательно использовать заезженные процедуры DirectDraw? Конечно, за долгое время существования были разработаны алгоритмы для многих эффектов: и динамического освещения, и даже систем частиц. Но все они работают очень медленно. Но у нас на дворе не 1996 год, и Voodoo Graphics является редкостью только из-за того, что все его уже повыкидывали. Поэтому было бы очень соблазнительно запрячь для повседневных нужд возможности 3D-акселератора.
3D-библиотеки могут помочь с выводом текстурированных полигонов (те же тайлы) - самым тормозным моментом в 2D-процедурах. При этом фильтрация (aka художественное размытие текстур) является само собой разумеющимся фактом. Кроме того, становятся доступны все эффекты, которые только есть в трехмерных играх: свет, прозрачность, тени, световые переходы и так далее. Предмет этот достаточно интересен для того, чтобы в нем попрактиковаться. Возможно, за ним лежит будущее тайловых игр.

Создание карт
Любая карта - это массив, задающий расположение тайлов на своих слоях, а также их параметры. Самая простая карта представляет собой матрицу MxN, где каждый ее элемент содержит номер тайла из условно принятой последовательности. Если вы когда-либо пользовались редактором карт двухмерной стратегии или РПГ (или работали в "Фотошопе"), вы легко уловите суть. Когда добавляются новые слои, матрица усложняется, получается уже набор (структура) матриц, а с введением каких-либо эффектов получается собственный формат карты, который занимает на диске не один мегабайт.
Тайлы не обязательно должны задаваться последовательными порядковыми номерами. Наоборот, для начала хорошо бы разбить весь ваш числовой ряд на несколько промежутков. Например, в промежуток от 0 до 63 входят обыкновенные тайлы, по которым можно ходить (земля, плиты). От 63 до 127 - непроходимые заросли джунглей, стены и другие твердые объекты. Следующий промежуток - воды озер и болот, наконец, специальные группы, которые выполняют какие-либо действия, когда герой “наступает” на них: порталы, ловушки и прочее. Теперь уже, по мере производства "Фотошопом" графики, вы присваиваете новичкам номера, исходя из принятых правил, и в дальнейшем освобождаетесь от многих проблем, связанных с определением проходимости участка или того, как надо реагировать, когда герой вошел в портал.
При прорисовке карты у вас поначалу могут возникнуть проблемы с рисованием изометрических тайлов, ведь они такие “кривые”, что непонятно, где надо рисовать один и продолжать второй. Трудности могут возникать при программировании плавного скроллинга или обрезки экраном участков карты. Кстати, размеры тайлов лучше всего делать в какой-либо степени двойки (16x16 или 32x32), это очень сильно помогает как вам, так и процессору при вычислениях.

То же самое относится и к размеру карты. Она должна быть по возможности квадратной и по размерностям делиться на размер составляющих "кирпичиков". Таким образом, при расчетах у вас никогда не будет дробных величин, с которыми невозможно работать. Поэтому большинство карт обладают размерами вроде 128x128 или 512x512.
Между прочим, перемещение персонажей по изометрической карте тоже происходит не просто так. Ведь наша карта повернута “вглубь” и абсолютный ее размер по вертикали в два раза меньше, чем по горизонтали. Поэтому и “вверх” любой ходячий предмет должен двигаться соответствующим образом. Вообще говоря, здесь надо применять формулы, в простейшем же случае на два шага в сторону приходится один шаг вглубь. Если вас интересуют точные расчеты, их легко будет отыскать в Интернете, в крайнем случае "мыльте" за советом. Это же относится к любому перемещению в изометрии, имеющей место хоть в абсолютно плоском квесте.
К счастью, все эти вопросы уже давно не относятся к разряду малоизученных технологий, и в Сети есть масса учебников по программированию изометрических двухмерных движков. Советую заглядывать в раздел статей таких сайтов, как www.gamedev.net и www.flipcode.com , или просто скормить какому либо Yahoo-подобному поисковику подходящие ключевые слова.

IsometriX
Ну а для любителей "поковырять программки" специально выкладываем на компакт движок по имени IsometriX . Он аккумулирует в себе все, что было сказано выше. В отличие от большинства трехмерных энжайнов и конструкторов игр, которые рассматривались в прошлом "Самопале", этот движок не ставит своей целью быть основой вашей игры. Он прежде всего предназначен для того, чтобы вы на практике посмотрели, как исполняются всякие теоретические вопросы. Движок полностью написан на Visual C++ , имеет исходный код и свой редактор уровней. Ежели вам не интересно программирование, вы все равно можете побродить по тестовому уровню, ничего при этом не компилируя.
По функциям IsometriX может показаться более чем скромным: 640x480 в 8-битном цвете - это, конечно, не дело. Но, как я уже сказал, это скорее пример, на основе которого вы можете научиться работать с картами, передвигать персонажей, проверять столкновения и делать многое другое. Кроме того, все прекрасно работает в Windows 9x/2000 и, скорее всего, будет в XP.
В напутствие

Что бы там ни говорили, двухмерные

тайловые движки и сейчас живее всех живых. Никакая 3D-игра еще не может сравниться с классическими двухмерками по детальности и красоте прорисовки. Возьмите хотя бы Fallout Tactics - в этой игре применены, пожалуй, самые прогрессивные достижения в области 2D. И никакой язык не повернется назвать графику этой игры убогой.
Кроме этого, тайлы идеально подходят для создания громадных миров. С использованием сегментирования, когда карта дробится на несколько кусков, каждый из которых динамически подгружается, можно делать карты просто фантастических размеров. И это активно используется в играх жанра RPG. Это еще один фактор, по которому разработчики не торопятся уходить в мир акселераторов и мультитекстурирования.
Ну и, наконец, тайловая графика гораздо проще в изучении, чем любой 3D-движок (хотя это может быть моим субъективным мнением). А уж изучение DirectDraw для оперирования спрайтами несравненно легче и понятнее, чем Direct3D и даже OpenGL. Поэтому не стремитесь бросаться сразу на передовой фронт. Возможно, вам стоит обратить внимание и на старый добрый 2D-мир. Ну, может быть, чуточку 2.5D... 16 августа 2017 в 12:31

Битовый способ отображения тайловых карт

Разработка игр

Перевод

Техника автоматического выбора нужного тайла из тайловой карты.

Сначала эта статья была ответом на , но мне показалось, что стоит его немного расширить и опубликовать отдельно.

Задача: мы сгенерировали красивый уровень платформера и хотим иметь возможность автоматически располагать тайлы на нём с учётом соседей, чтобы они выглядели правильно.

Тайлы, учитывающие своих соседей

Тайлы в Super Mario не учитывают своих соседей: каменный блок всегда выглядит одинаково, и как отдельный фрагмент, и как часть стены.

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

Однобитная карта

Представим, что какими-нибудь хитрыми техниками мы создали схему уровня платформера, состоящую только из каменных блоков и «воздуха» между ними. Уровень можно представить как однобитное изображение, в котором состояние каждого пикселя определяется единственным битом (1 - каменный блок, 0 - «воздух»). Вот увеличенный пример части такого уровня с добавленными линиями сетки:

Набор тайлов (тайлсет)

Тайлсет - это набор графических изображений, которые можно использовать для заполнения карты. Тайлсет Mario довольно ограничен, он состоит из нескольких типов блоков и «декораций», но наш набор будет содержать множество изображений для каждого типа тайлов:

Оцениваем соседей

Чтобы определить, какой тайл должен находиться в конкретной точке карты, мы должны изучить непосредственных соседей этой точки (пока мы игнорируем соседей по диагонали). Чтобы не писать большие конструкции из if/else-if для обработки всех возможные комбинации соседей, мы используем систему, назначающую значения в каждом направлении.

Значение для каждой точки находится исследованием её соседей и прибавлением значений для тех из них, в которых есть камень. Например, если у исследуемой точки сосед сверху тоже заполнен камнем, то ей присваивается значение 1. Если заполнены камнем соседи сверху и снизу, то точке присваивается значение 1 + 4, то есть 5.

Можно заметить, что присваиваемые значения направлений такие же, что и значения в позициях в двоичных числах, и это неудивительно: оба типа значений - это способы представления возможных комбинаций четырёх позиций, каждая из которых может быть во «включенном» или «выключенном» состояниях (камень или «воздух»).

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

Сложение тайлов

Представленный на изображении способ расположения тайлсета не случаен: он расположен таким образом, чтобы каждый тайл соответствовал тайлу карты, которому должно быть назначено значение. Присвоив значения всем точкам карты, мы просто ищем значение в тайлсете и размещаем в этой точке подходящий тайл:

Отлично!

Двигаемся дальше

Часть первая: избавляемся от «воздуха»

Приведённый выше пример хорошо работает для висящих в воздухе платформ, но на самом деле не полностью обрабатывает два типа тайлов.

Представим, что вместо платформера мы работаем над двухмерной стратегией с видом сверху, в которой есть два типа тайлов - трава и вода. В таком случае тайловое изображение будет присутствовать в каждой точке карты, в ней не будет пустых мест, как в платформере. Это значит, что для определения подходящего тайла у каждой точки карты должно быть значение, сгенерированное на основании её соседей.

Мы можем использовать точно такую же систему оценки соседей, как и прежде, но нам потребуется способ, позволяющий при изучении точки определить, что в ней находится - трава или вода. Это реализовать очень просто - достаточно только добавить ещё одно значение самой точке, по тому же шаблону «2 в степени n» из других значений:

Давайте решим, что в случае наличия воды мы будем прибавлять к значению точки, а при наличии травы - не будем. То есть тайл травы, окружённый со всех сторон травой, будет иметь значение 0. Тайл травы с водой сверху и справа, имеет значение 1 + 8 = 9. Тайл воды, окружённый со всех сторон травой, будет иметь значение 16. Тайл воды, окружённый со всех сторон водой, имеет значение 1 + 2 + 4 + 8 + 16 = 31

Часть вторая: добавляем вариативности

Как обеспечить обработку других типов рельефа?

Допустим, в игре с видом сверху есть три типа рельефа: вода, трава и лес. Мы уже обрабатываем границы воды и травы, теперь нам нужно научиться обрабатывать границы воды и леса, а также травы и леса.

Раньше у нас было два варианта тайлов для каждой соседней позиции (трава или вода), поэтому мы использовали двоичную систему исчисления. Теперь варианта уже три, поэтому нам нужно использовать троичную систему. Необходимо изменить систему оценки соседей для соответствия новой системе исчисления:

В двоичной системе использовался шаблон «2 в степени n», в новой же будем применяться шаблон «3 в степени n».

В троичной системе каждое положение имеет три возможных состояния: трава, вода, лес, или 0, 1, 2. Когда в текущей точке находится трава, мы игнорируем значение (умножаем его на 0). Когда в точке находится вода, мы прибавляем заданное значение (умножаем его на 1). В случае леса мы прибавляем удвоенное значение (умножаем его на 2).

То есть в случае тайла леса сверху и справа от которого находится вода, снизу лес, а слева трава: 81 * 3 + 1 * 2 + 3 * 1 + 9 * 3 + 27 * 0 = 275

Как можно заметить, на этом этапе для охвата всех комбинаций карты с тремя типами рельефа нужно уже отрисовать 324 тайловых изображения. При работе вручную это бы заняло очень много времени. Крайне рекомендую изучить хотя бы частично автоматизированные способы создания такого множества комбинаций.

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

Техника автоматического выбора нужного тайла из тайловой карты.

Тайлы, учитывающие своих соседей

Однобитная карта

Представим, что какими-нибудь хитрыми техниками мы создали схему уровня платформера, состоящую только из каменных блоков и «воздуха» между ними. Уровень можно представить как однобитное изображение, в котором состояние каждого пикселя определяется единственным битом (1 — каменный блок, 0 — «воздух»). Вот увеличенный пример части такого уровня с добавленными линиями сетки:

Набор тайлов (тайлсет)

Тайлсет — это набор графических изображений, которые можно использовать для заполнения карты. Тайлсет Mario довольно ограничен, он состоит из нескольких типов блоков и «декораций», но наш набор будет содержать множество изображений для каждого типа тайлов:

Оцениваем соседей

Можно заметить, что присваиваемые значения направлений такие же, что и значения в позициях в двоичных числах, и это неудивительно: оба типа значений — это способы представления возможных комбинаций четырёх позиций, каждая из которых может быть во «включенном» или «выключенном» состояниях (камень или «воздух»).

Сложение тайлов

Отлично!

Двигаемся дальше

Часть первая: избавляемся от «воздуха»

Представим, что вместо платформера мы работаем над двухмерной стратегией с видом сверху, в которой есть два типа тайлов — трава и вода. В таком случае тайловое изображение будет присутствовать в каждой точке карты, в ней не будет пустых мест, как в платформере. Это значит, что для определения подходящего тайла у каждой точки карты должно быть значение, сгенерированное на основании её соседей.

Мы можем использовать точно такую же систему оценки соседей, как и прежде, но нам потребуется способ, позволяющий при изучении точки определить, что в ней находится — трава или вода. Это реализовать очень просто — достаточно только добавить ещё одно значение самой точке, по тому же шаблону «2 в степени n» из других значений:

Давайте решим, что в случае наличия воды мы будем прибавлять к значению точки, а при наличии травы — не будем. То есть тайл травы, окружённый со всех сторон травой, будет иметь значение 0. Тайл травы с водой сверху и справа, имеет значение 1 + 8 = 9. Тайл воды, окружённый со всех сторон травой, будет иметь значение 16. Тайл воды, окружённый со всех сторон водой, имеет значение 1 + 2 + 4 + 8 + 16 = 31

Часть вторая: добавляем вариативности

Как обеспечить обработку других типов рельефа?

В двоичной системе использовался шаблон «2 в степени n», в новой же будем применяться шаблон «3 в степени n».

API Яндекс.Карт позволяет накладывать пользовательские слои поверх слоев географической карты. Пользовательские слои могут использоваться, например, для обозначения зоны покрытия сети связи или схемы расположения зданий на местности .

Кроме того, API может использоваться и для отображения на сайте карт и планов, не имеющих привязки к земной поверхности: например, карт игровых миров, фотографий , поэтажных планов сооружений или планов местности .

Для того, чтобы использовать изображение в качестве пользовательского слоя Яндекс.Карт, его необходимо предварительно подготовить. Подготовка изображения включает в себя два этапа:

Привязка изображения к географическим координатам (совмещение изображения с картой).

Привязка включает в себя поворот, масштабирование и морфинг изображения таким образом, чтобы на каждом масштабном уровне пиксельные координаты заданных геоточек на изображении совпадали с пискельными координатами этих же геоточек в массиве растровых данных Яндекс.Карт.

Формирование наборов тайлов.

Привязанное к координатам изображение требуется нарезать на фрагменты (тайлы) размером 256x256 пикселов. Каждый тайл хранится в отдельном файле (JPEG или PNG). Для каждого значения коэффициента масштабирования должен быть сформирован свой набор тайлов.

Приложение "Подготовка слоя тайлов"

Приложение "Подготовка слоя тайлов" позволяет автоматизировать процесс подготовки произвольного изображения для показа на веб-странице с помощью API Яндекс.Карт.

","hasTopCallout":false,"hasBottomCallout":false,"areas":[{"href":"http://download.yandex.ru/maps/tools/tiler/ymaptiler.exe","shape":"rect","alt":"","justMapLink":true,"coords":,"isNumeric":false}]}}">

Приложение позволяет полностью автоматизировать решение следующих задач:

нарезка тайлов с привязкой по координатам -- на изображение наносятся точки привязки, устанавливается соответствие пиксельных координат географическим, изображение перепроецируется под привязку и нарезается на тайлы. Полученные тайлы могут использоваться в качестве источника данных для пользовательского слоя карты (см. ).
нарезка тайлов без привязки по координатам -- изображение сразу нарезается на тайлы для отображения с помощью API (например, для просмотра фотографий и планов).
создание кода HTML-страницы с готовой картой для размещения на сайте.

Ограничение.

Приложение доступно только для операционной системы Microsoft Windows.

Быстрый старт

Откройте изображение (в меню Файл выберите команду Открыть изображение ).

Исходное изображение может быть в одном из следующих форматов: , или.

Если изображение должно быть привязано к участку земной поверхности, установите флажок Привязка , расставьте на изображении точки привязки и задайте их географические координаты (долготу и широту).

Экспортируйте изображение в требуемый каталог. Необходимые наборы тайлов и HTML-код карты будут сформированы автоматически.

Загрузите полученные тайлы и HTML-код карты на сайт.

Управление точками привязки

Внимание. Чтобы перейти в режим редактирования геопривязанного изображения, установите флажок Привязка .

Привязка изображения к участку земной поверхности осуществляется по 4-м (или более) точкам, расставленным, как правило, по углам изображения. Каждая точка привязки имеет две пары координат: пиксельные координаты (X и Y) и географические (широта и долгота).

Начало отсчета пиксельных координат находится в верхнем левом углу изображения, X – номер пикселя по горизонтали, Y – по вертикали.

Географические координаты точек привязки задаются в десятичном формате. Например, для долготы 34°30" десятичное значение составляет 34.5.

Создание точки привязки

Чтобы создать точку привязки на изображении:

Нажмите кнопку Добавить .

Щелкните место на изображении, где необходимо расположить новую точку привязки.

Перемещение точки привязки

Точки привязки можно перетаскивать мышью.

Удаление точки привязки

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

Сохранение точек привязки в файл

Экспорт изображения

Внимание. Для успешного экспорта геопривязанного изображения требуется задать как минимум 4 точки привязки, указав для каждой из них географические координаты.

Приложение "Подготовка слоя тайлов" позволяет экспортировать в виде карты как все изображение целиком (по умолчанию), так и выделенную прямоугольную область. Область экспорта отмечается на изображении синей рамкой (изначально включающей в себя все изображение). Чтобы получить возможность изменить границы области, щелкните по рамке кнопкой мыши.

Чтобы экспортировать изображение в виде наборов тайлов и HTML-кода карты:

В меню Файл выберите команду Экспорт карты . Откроется диалоговое окно, в котором требуется задать параметры экспорта тайлов (см. список параметров ниже).

Нажмите Готово . Если изображение имеет большие размеры, то его преобразование и формирование тайлов могут занять несколько минут.

Параметры экспорта тайлов

Каталог для сохранения тайлов Папка, в которой будут созданы файлы тайлов и HTML-файл с кодом карты. Маска имен файлов тайлов Задает правила формирования имен тайловых файлов. Вместо символов %z в имя файла подставляется коэффициент масштабирования, для которого предназначен тайл, вместо %x и %y – координаты тайла. Например, если задана маска %z\tile-%x-%y.png , то тайл с координатами (43797;20185) для 16-го масштаба будет сохранен в подпапку 16 под именем tile-43797-20185.png . Формировать HTML-код карты в файле Установите флажок, если кроме тайлов требуется сформировать HTML-код карты в отдельном файле. Масштабные уровни Максимальное значение коэффициента масштабирования и общее количество его возможных значений, для которых требуется сформировать тайлы. Например, если необходимы тайлы для уровней с 0 по 16, выберите в раскрывающемся списке Максимальный масштаб значение 16, а в списке Количество уровней – 17. Для геопривязанных изображений максимальный возможный масштаб определяется автоматически. Если требуется экспортировать привязанное изображение в большем масштабе, то следует увеличить его размер в графическом редакторе. Формат файлов тайлов Тайлы могут быть экспортированы в один из двух форматов: или. Цвет для заполнения пустот Задайте цвет для заполнения пустот, если выбран формат экспорта JPEG. Данный параметр определяет, каким цветом должны быть заполнены прозрачные участки исходного изображения, а также прозрачные области, которые могут образоваться при повороте изображения во время преобразования. Прозрачность Задайте прозрачность, если выбран формат экспорта PNG. Если пользовательский слой будет отображаться поверх одного из стандартных слоев карты (Схема, Спутник или Гибрид), то тайлы следует сделать полупрозрачными. API-ключ Яндекс.Карт Уникальный API-ключ, полученный для сайта, на котором будет размещена карта. Название слоя тайлов Имя пользовательского слоя, которое будет отображаться в элементе управления "Выбор типа карты". Слой-подложка под слоем тайлов Название слоя Яндекс.Карт, поверх которого будет отображаться созданный пользовательский слой. Элементы управления Яндекс.Карт Названия стандартных элементов управления, которые будут доступны на сформированной карте.

Тайл - это фактически кусочек картинки. Тайлсет - набор тайлов. Обычно используют квадратные тайлы. С помощью тайлов делают игровое пространство в стратегиях и RPG. Примеры: C&C, WarCraft, Fallout. Под типом тайла понимается принадлежность его к семейству. Например, трава и земля - типы тайлов. Под переходом понимается буквальный переход одного тайла в другой при текстурировании геометрии. Тайл с переходом - это тайл, не являющийся сплошным.

Я выходил на контакт с Blizzard, хотел чтобы они разрешили мне использовать пару их тайлсетов. Но мне ответили, что получить разрешение будет очень сложно, так как тот, кто рисовал текстуры в штате у них не числится, а права на них остаются за этим человеком. Так что я решил нарисовать свои тайлсеты. Для удобоваримости я их сделал похожими на тайлсеты Blizzard из WarCraft III. Итак, вот они:

Стоит задача - использовать тайлсеты, т.е. накладывать на геометрию так же или почти так же как это делает редактор миров Warcraft III. Итак, вначале у нас есть геометрия, залитая чем-то на подобие тайла нулевого слоя:

схема 0

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

Предположим, что по клику мышки мы хотим вписать на карту "кружок", составленный из четырех тайлов. Например:

схема 1

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

Итак, вот как интерпретируется схема 1 в виде карты чисел:

схема 2

Вписать четыре единицы в кучу нулей не составляет труда. Основная загвоздка в том как подобрать нужный тайл, то бишь, с нужным переходом. Следует помнить, что сходиться в одном квадрате может до четырех текстур. У квадрата четыре стороны, поэтому с каждой может быть свой тайл. Вернемся немного назад к тому как мы накладывали кружок из травы. Да, в оригинальном редакторе тоже появляется кружок, если мы тычем мышкой на пустую землю. Я предлагаю выбрать в качестве приоритетной формы тайлинга сплошные квадраты. То есть при каждом клике мыши на карту квадратов, программа должна стремиться наложить в месте клика 4 сплошных тайла. Однако 4 сплошных тайла будут уместны только в том случае, если их тип совпадает с уже имеющимися на карте тайлами, причем те не должны быть переходными. Иначе, если слепо наложить 4 сплошных тайла, мы получим острый квадрат. А острых углов обычно избегают. Короче говоря, мы только предполагаем что будут наложены четыре сплошных тайла. Но прежде чем их наложить, мы должны провести анализ соседних квадратов, и, если потребуется, сменить сплошые тайлы на переходные.

Разберемся как же получается кружок на схеме 1. Предлагаю рассмотреть более детально процесс на схеме 1:

1. Мышь кликает на еще пустой квадрат a схемы 0. Тем самым выбираются 4 квадрата (a,b,c,d) для обработки.

2. Не глядя в карту типов тайлов мы записываем четыре единицы (схема 2).

3. Начинаем анализировать то что получилось на схеме 2. Мы должны проанализировать 4 угла (отмечены цифрами на схеме 3). Таким образом, переход тайла в квадрате a будет определяться углом 1, в квадрате b - углом 2 , в квадрате c - углом 3 , в квадрате d - углом 4 .

схема 3

Теперь нужно проанализировать эти четыре угла по отдельности, тем самым упрощая задачу.

Рассмотрим первый угол.

схема 3.1

Наша задача - установить нужный тайл в квадрате a . Делаем предположение что в квадрате a будет сплошной тайл. Например такой:

Смотрим на схему 3.1. Там видим, что на накладываемый тайл травы, закодированный единицей, действуют другие соседние тайлы, закодированные нулями. Желтый нуль своим действием трансформирует сплошной тайл в переходный тайл такого вида:

Зеленому нулю нечего внести в имеющуюся картину, а красный нуль трансформирует дальше так:

А потом синий довершает картину, т.к. серый не вносит отличий:

Именно этот получившийся переходный тайл мы и помещаем в квадрат a . Причем не важно в каком порядке мы рассматриваем действия соседних тайлов. Аналогичные рассуждения можно провести и для остальных квадратов b,c,d . В итоге должна получиться картинка как на схеме 1.

Со схемой 1 разобрались успешно. Я рассуждал о "действиях нулей" исключительно ради того, чтобы было лучше понятно. При реализации совсем не нужно писать функции, отождествленные с этими действиями, достаточно собрать только битовую маску тайла. По битовой маске совершенно однозначно выбирается тайл. Битовую маску в данном случае удобно делать 2х2, т.к. нетрудно заметить что четыре бита вместе дадут 16 различных значений, а в заготовленных тайлсетах как раз 16 вариаций переходов.

Также заметим, что "оказывать действия" могут только те соседние тайлы, которые имеют отличный от накладываемых тайлов тип. Еще вы наверно посчитали что в тайлсетах не 16, а 15 вариаций переходов. Это верно, так как полностью нулевая маска не имеет смысла в контексте накладываемой текстуры тайла. Однако она имеет смысл в текстурировании при подборе координат текстур для нескольких переходов в одном квадрате. Этим смыслом можно себя не загружать, а реализовать, как Бог на душу положит.