Как создавать собственные стилизованные карты с помощью OpenStreetMap: 7 шагов (с изображениями)

2024 Автор: John Day | [email protected]. Последнее изменение: 2024-01-30 11:50

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

В следующем видео показано, как я лично создаю стилизованные карты, но продолжайте читать, чтобы узнать подробности. Я очень рад видеть, что создает сообщество!

Какова моя мотивация в этом проекте?

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

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

Ресурсы / Ссылки:

• OpenStreetMap
• OpenStreetMap Легальский
• Репозиторий Github

Запасы

• Дистрибутив Python (я использовал Anaconda и Python 3.6)
• PyQt5 (для зависимостей графического интерфейса)

Шаг 1. Определение процесса I. Загрузка файла OSM

Когда я только начал этот проект, самым вопиющим вопросом было: «Где я могу получить данные карты». Естественно, как и следовало ожидать, я сразу подумал о Google Maps. После значительного исследования я обнаружил, что Google действительно не хочет, чтобы люди играли со своими данными в творческом или ином смысле. Фактически, они явно запрещают сбор данных из Google Maps.

К счастью, мое отчаяние длилось недолго после открытия OpenStreetMap (OSM). OSM - это совместный проект, в котором участвуют люди со всего мира, предоставляющие данные. OSM явно разрешает неограниченное использование своих данных от имени программного обеспечения с открытым исходным кодом. Таким образом, посещение веб-страницы OSM - это то место, где начинается путешествие по стилизации карты.

После перехода на веб-сайт OSM щелкните вкладку «Экспорт», чтобы отобразить инструменты экспорта карты. Теперь увеличьте масштаб, чтобы просмотреть регион, для которого вы хотите собирать данные карты. Выберите ссылку «Выбрать другую область вручную», после чего на экране появится окно. Сформируйте и поместите этот прямоугольник над интересующей областью. Когда вы будете удовлетворены, нажмите кнопку «Экспорт», чтобы загрузить файл данных OSM.

Примечание №1: если выбранный вами регион содержит слишком много данных, вы получите сообщение об ошибке, что вы выбрали слишком много узлов. Если это произойдет с вами, нажмите кнопку «Overpass API», чтобы загрузить файл большего размера.

Примечание №2: если размер загруженного файла OSM превышает 30 МБ, написанная мной программа Python будет заметно медленнее. Если вы настроены использовать большую область, подумайте о написании сценария, чтобы выбросить лишние данные, которые вы не планируете рисовать.

Шаг 2: определение процесса II: понимание данных

"У меня есть данные … что теперь?"

Начните с открытия загруженного файла OSM в вашей любимой программе для редактирования текста. Сначала вы заметите, что это файл XML, и это здорово! XML достаточно легко анализировать. Начало вашего файла должно выглядеть почти идентично первому изображению этого шага - будут перечислены некоторые основные метаданные и географические границы.

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

1. Узлы
2. Способы
3. связи

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

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

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

Вы можете узнать больше об этих элементах данных в вики OSM:

• Узлы
• Способы
• связи

Шаг 3: Определение процесса III: Обработка данных

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

Пакет xml по умолчанию включен в большинство стандартных дистрибутивов Python. Мы будем использовать этот пакет, чтобы очень легко проанализировать наш файл OSM, как показано на первом изображении. В одном цикле for вы можете обрабатывать данные OSM для каждого конкретного элемента данных.

Вы заметите, что в последней строке изображения я проверяю наличие тега «bounds». Этот шаг жизненно важен для перевода значений широты и долготы в пиксели на экране. Я настоятельно рекомендую запускать это преобразование во время загрузки файла OSM, так как массовое преобразование данных требует значительного процесса.

Говоря о преобразовании широты и долготы в координаты экрана, вот ссылка на функцию вычисления, которую я написал. Вы, вероятно, заметите что-то немного странное при преобразовании широты в координаты экрана. Это дополнительный шаг по сравнению с долготой! Как оказалось, данные OSM моделируются с использованием метода проекции Псевдо-Меркатора. К счастью, у OSM есть фантастическая документация по этой теме, и они предоставляют функции преобразования широты для значительного числа языков. Потрясающие!

Примечание. В моем коде координата экрана (0, 0) - это верхний левый угол экрана.

Шаг 4: реализация Python Map Stylizer

До этого момента я обсуждал файл данных OSM - что это такое, как его читать и что с ним делать. Теперь я расскажу о программном обеспечении, которое я написал для решения стилистической визуализации карт (репозиторий GitHub представлен во введении).

Моя конкретная реализация фокусируется на пользовательском управлении конвейером рендеринга. В частности, я разрешаю пользователю выбирать слои, которые они хотят видеть, и способ визуализации этого слоя. Как я кратко упоминал ранее, существует два класса визуализируемых элементов: элементы заливки и элементы строки. Заливки определяются только цветом, в то время как линии определяются цветом, шириной линии, стилем линии, стилем окончания линии и стилем соединения линий.

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

Шаг 5: недостаток реализации + решение

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

Я начал с того, что определил, какие слои меня особенно интересуют. Для целей этой инструкции, скажем, меня больше всего интересуют здания (все они), реки, основные магистрали и наземные улицы. Я бы написал сценарий, в котором я создаю экземпляр Configuration, соответствующим образом переключаю состояния слоев с помощью функции setItemState () и определенных констант и устанавливаю цвета в зависимости от того, как я хочу, чтобы мои слои отображались с помощью setValue (). Полученный файл конфигурации, который будет сохранен, может быть скопирован в папку config и загружен пользователем.

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

Шаг 6: области для улучшения

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

1. Рендеринг динамического слоя. В настоящее время у меня есть предопределенный список слоев, которые будут отображаться, вот и все. Частично оправдание заключалась в сложности определения того, должен ли слой быть линией или заливкой. В результате почти при каждом открытии файла OSM вы будете встречены множеством предупреждений о слоях, которые не будут отображаться. Часто они настолько минимальны, что это не проблема, но обязательно должны отсутствовать важные слои. Рендеринг динамического слоя устранит эти проблемы.
2. Назначение динамического слоя. Это идет рука об руку с №1; если вы хотите рендеринг динамического слоя, вам нужно динамическое назначение слоя (т. е. определение слоя заливки по сравнению с линейным слоем). Как я узнал, это можно было бы разумно выполнить, потому что пути, первый и последний узел которых совпадают, будут закрытыми путями и, следовательно, заполненными.
3. Цветовые группы. Стилизованная карта часто имеет несколько слоев с одинаковым стилем, и предоставление пользователю возможности изменять стиль группы одновременно значительно сокращает время, затрачиваемое пользователем на редактирование слоев один за другим.

Шаг 7. Заключительные мысли

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

Особая благодарность участникам OpenStreetMap! Подобные проекты были бы невозможны без их значительных усилий.

Пожалуйста, дайте мне знать, если у вас возникнут вопросы в комментариях!

Финалист конкурса карт