Статьи

Использование JavaScript для создания геопространственных и расширенных карт

Геопространственные информационные системы (ГИС) — это область картографии и информационных технологий, связанная с хранением, обработкой, анализом и представлением географических и пространственных данных. Вы, вероятно, наиболее знакомы с ГИС-сервисами, которые создают динамические двумерные мозаичные карты, которые были заметны в Интернете со времен MapQuest .

До недавнего времени для разработки геопространственных приложений за пределами 2D-карты требовался комплексный ГИС-сервис, такой как ArcGIS, Nokia Here или Google Maps. Хотя эти API являются мощными, они также дороги, трудны в освоении и привязывают разработчика карты к одному решению. К счастью, в настоящее время существует множество полезных инструментов JavaScript с открытым исходным кодом для обработки расширенной картографии и геопространственного анализа.

В этой статье я расскажу, как реализовать ГИС-методы с помощью JavaScript и HTML, сосредоточив внимание на легких инструментах для конкретных задач. Многие из инструментов, о которых я расскажу, основаны на таких сервисах, как Mapbox, CloudMade и MapZen, но это все модульные библиотеки, которые можно добавлять в виде пакетов в Node.js или использовать для анализа в веб-браузере.

Примечание . Примеры CodePen, встроенные в этот пост, лучше всего просматривать непосредственно на CodePen.

Геометрия и 3D

Расстояние и Измерение

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

  • Geolib предоставляет расчеты расстояния (и расчетного времени) между двумя координатами широта-широта. Удобной функцией Geolib является порядок по расстоянию , который сортирует список или массив по расстоянию. Библиотека также поддерживает возвышение.
  • Turf.js , который описан в следующем разделе, также предоставляет функцию расстояния для вычисления расстояния между двумя точками. Кроме того, Turf.js рассчитывает площадь, расстояние по траектории и среднюю точку между точками.
  • Сильвестр — это библиотека для геометрии, векторной и матричной математики в JavaScript. Эта библиотека полезна, когда базовых измерений линий и плоскостей недостаточно.

3D

Хотя вышеперечисленные библиотеки хорошо подходят для 2D-проекций географии, трехмерная ГИС является захватывающей и обширной областью, что естественно, потому что мы живем в 3D-пространстве. К счастью, WebGL и холст HTML5 также открыли новые 3D-методы для веб-разработчиков.

  • Three.js — это библиотека JavaScript для геометрических и ячеистых объектов. Расширение Three GeoJSON для Three.js предоставляет простой способ визуализации объектов GeoJSON на трехмерных плоскостях и сферах.
  • Проект OSM Buildings позволяет разработчику карты представлять здания в виде 3D-объектов на 2D-карте. В проекте используются OpenLayers и Leaflet. Это может быть использовано с большим эффектом, например, Том Холдернесс использовал OSM Buildings для картирования Лондона .

Вот пример того, как отобразить объекты GeoJSON на трехмерном объекте:

Вы также можете ознакомиться со статьей Байрона Хоувена о WebGL и JavaScript , в которой показано, как создать карту местности с помощью Three.js.

Географические особенности и очки

Большая часть работы в ГИС включает в себя работу с точками, формами, символами и другими функциями. Основная задача — добавить фигуру или точечные объекты на карту. Хорошо зарекомендовавшая себя библиотека Leaflet и новичок Turf.js значительно упрощают эту задачу и позволяют пользователям работать с коллекциями функций.

  • Leaflet — это просто лучший вариант для работы с отображением точек, символов и всеми типами функций на веб-устройствах и мобильных устройствах. Библиотека поддерживает прямоугольники , круги , многоугольники , точки , пользовательские маркеры и широкий спектр слоев. Он работает быстро и обрабатывает различные форматы. Библиотека также имеет богатую экосистему сторонних плагинов .
  • Turf.js — это библиотека Mapbox для геопространственного анализа. Одним из замечательных преимуществ Turf.js является то, что вы можете создать коллекцию объектов, а затем пространственно проанализировать, изменить (геообработку) и упростить их, прежде чем использовать Leaflet для представления данных. Как и Geolib, Turf.js рассчитает длину пути, центр объекта, точки внутри объекта.
  • Простая карта D3 создает хороплеты и другие символы , просто определяя объект GeoJSON и атрибут данных.

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

Ключевым понятием в Turf.js является набор географических объектов , таких как полигоны. Эти функции обычно являются функциями GeoJSON, которые вы хотите анализировать, манипулировать или отображать на карте. Вы начинаете с объекта GeoJSON с массивом объектов графства. Затем создайте коллекцию из этого объекта:

collection = turf.featurecollection(counties.features);

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

В случае плотности населения можно рассчитать естественные разрывы ( оптимизация Дженкса ) или квантильные классификации для плотности населения:

 breaks = turf.jenks(collection, "pop_density", 8);

Значение плотности населения (население, деленное на площадь) было рассчитано и сохранено как свойство каждого округа, но операция работает для любого свойства объекта.

Работа с точками

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

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

Существуют также расширения для Leaflet.js, которые помогают при работе с большим количеством точек:

  • Marker Cluster for Leaflet отлично подходит для визуализации результатов Turf или набора больших точек. Сама библиотека обрабатывает сотни точек, но есть плагины, такие как Marker Cluster и Mask Canvas для обработки сотен тысяч точек.
  • Heat for Leaflet создает динамическую тепловую карту из точечных данных. Это даже работает для наборов данных с тысячами точек.

Геокодирование и маршрутизация

Для маршрутизации, геокодирования и обратного геокодирования требуется онлайн-сервис, такой как Google или Nokia Here, но последние библиотеки упростили реализацию. Есть также подходящие альтернативы с открытым исходным кодом.

HTML5 Geolocation API предоставляет простой метод получения местоположения GPS устройства (с разрешения пользователя):

 navigator.geolocation.getCurrentPosition(function(result){
  // do something with result.coords
);

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

  • GeoSeach — это плагин Leaflet для геокодирования, который позволяет разработчику выбирать между геокодером ArcGIS, Google и OpenStreetMaps. После добавления элемента управления на базовую карту он автоматически использует выбранный сервис геокодирования, чтобы отобразить лучший результат поиска на карте. Библиотека предназначена для расширения другими сторонними сервисами.
  • Geo for Node.js — это библиотека геокодирования, которая использует Google Geocode API для геокодирования и обратного геокодирования. Кроме того, он поддерживает систему Geohash для кодирования URL координат широты и долготы.

Как и в случае с геокодированием, существует множество служб маршрутизации и направления, но они будут стоить вам. Надежной альтернативой с открытым исходным кодом является служба машины с открытым исходным кодом (OSRM) от MapZen. Предоставляется бесплатный сервис маршрутизации автомобилей, велосипедов и пешеходных маршрутов. Transit Mix умно использует инструмент маршрутизации OSRM для создания маршрутов в своем инструменте планирования перевозок.

Пространственный и сетевой анализ

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

Вывод

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

Если вы хотите пойти еще дальше с геопространственным анализом и геообработкой с помощью JavaScript, вот еще несколько ресурсов и утилит:

  • NetworkX и D3.jsкнига Майка Дьюарса о D3.js включает в себя ряд примеров использования D3 с картами и пространственным анализом. Один из наиболее интересных примеров — создание ориентированного графа метро Нью-Йорка, которое выполняется путем анализа спецификации Google Transit для MTA с NetworkX.
  • Simply.js — Turf использует Simply.js Владимира Агафонкина для упрощения формы. Эту библиотеку также можно установить как самостоятельный пакет Node.js для оперативной или автономной обработки файлов.
  • d3 Geo Exploder — d3.geo.exploder Бена Саутгейта позволяет вам переносить географические объекты (geoJSON) в другую фигуру, например, в виде сетки или точечной диаграммы.
  • Shp — используйте эту библиотеку для преобразования шейп-файла (и файлов данных) в GeoJSON
  • ToGeoJSON — используйте эту библиотеку для конвертации KML и GPX в GeoJSON
  • Shp2stl — используйте эту библиотеку для преобразования геоданных в 3D-модели, которые могут быть визуализированы или напечатаны в 3D.
  • MetaCRS и Proj4js — используйте эти библиотеки для преобразования между системами координат.