Это первая статья из серии о работе с картами в веб-разработке. Здесь я хочу разобрать очень важный тип данных, без которых очень сложно представить работу карт в современных веб-приложениях. Итак, сегодня мы разберем, что такое GeoJSON, из чего он состоит и для чего он нужен.
GeoJSON — это формат данных для представления географических объектов и их атрибутов. Он используется для хранения и обмена геоданными, такими как точки, линии и многоугольники, а также связанными с ними атрибутами, такими как имя, описание, адрес и т. д. Если вам нужны дополнительные технические и официальные пояснения, посетите страницу формата GeoJSON.
GeoJSON использует текстовый формат JSON для представления данных, что делает его легко читаемым как людьми, так и компьютерами. В формате GeoJSON геометрические объекты определяются как Point, LineString, Polygon, MultiPoint, MultiLineString и Многополигон.
В GeoJSON также можно задавать систему координат и другие параметры геометрических объектов, такие как тип геометрии, точность координат и другие свойства, но об этом мы поговорим в следующей статье.
GeoJSON стал широко используемым форматом данных в области геоинформатики и разработки программного обеспечения.
Существует множество библиотек JavaScript, которые используют GeoJSON для работы с географическими данными. Некоторые популярные библиотеки:
- Mapbox GL JS —клиентская библиотека JavaScript для создания веб-карт и веб-приложений с использованием современной картографической технологии Mapbox.
- Leaflet — библиотека JavaScript с открытым исходным кодом для создания интерактивных карт для мобильных устройств.
- Turf.js — библиотека JavaScript для выполнения пространственных операций и анализа данных GeoJSON.
- D3.js — библиотека JavaScript для создания динамических интерактивных визуализаций данных в веб-браузерах.
- OpenLayers — это библиотека JavaScript с открытым исходным кодом для отображения картографических данных в веб-браузерах в виде скользящих карт.
- и многие другие…
Точка 🔴
Точка в GeoJSON похожа на местоположение на карте сокровищ. Это конкретное место на карте, которое можно определить с помощью набора координат (широта и долгота). Точно так же, как вы можете использовать «X отмечает место», чтобы указать, где зарыто сокровище, точка в GeoJSON использует координаты, чтобы показать, где что-то находится на поверхности Земли.
Например, если вы делаете карту своего района и хотите показать, где находится ваш дом, вы можете использовать точку в GeoJSON, чтобы отметить точное местоположение вашего дома на карте.
В целом, точка — это просто способ представления одного местоположения на карте.
Точное представление GeoJSON:
{
"coordinates": [
8.308903076149363,
47.05038385401457
],
"type": "Point"
}
LineString 📈
LineString в GeoJSON похож на путь на карте сокровищ. Это линия, соединяющая ряд точек, и ее можно использовать для отображения маршрута или пути между двумя или более местами.
Например, представьте, что вы делаете карту сокровищ, которая ведет к спрятанному сокровищу. Или вы просто хотите найти дорогу к ближайшей пекарне 🥨
Вы можете использовать LineString, чтобы нарисовать путь на карте, который показывает маршрут от начальной точки до местоположения сокровища. LineString будет состоять из ряда точек, которые соединяются в линию, точно так же, как рисунок точка за точкой.
В GeoJSON LineString — это способ представления ряда связанных точек в виде единого объекта, упрощающий отображение пути или маршрута на карте. Он обычно используется в таких приложениях, как навигация и планирование транспорта.
Представление LineString GeoJSON:
{
"coordinates": [
[
8.310242689008646,
47.05429444841852
],
[
8.310504651721004,
47.05399445514598
],
[
8.309440079847974,
47.05356534791096
],
[
8.309228280208345,
47.05341345071696
],
[
8.309100085689579,
47.05285522481279
],
[
8.308498128818854,
47.05292737678937
]
],
"type": "LineString"
}
Многоугольник🔲
Многоугольник в GeoJSON подобен форме на карте сокровищ. Это замкнутая фигура, состоящая из прямых линий, и ее можно использовать для обозначения контуров области, например парка, озера или здания.
Например, представьте, что вы делаете карту сокровищ, которая ведет к замку. Вы можете использовать многоугольник, чтобы нарисовать форму стен замка на карте. Многоугольник будет состоять из ряда точек, которые соединяются в замкнутую форму, точно так же, как рисование контура замка на листе бумаги.
Представление Polygon GeoJSON:
{
"coordinates": [
[
[
12.478129652015241,
41.9022826549635
],
[
12.478129652015241,
41.90136017129154
],
[
12.479303348926749,
41.90136017129154
],
[
12.479303348926749,
41.9022826549635
],
[
12.478129652015241,
41.9022826549635
]
]
],
"type": "Polygon"
}
На самом деле, Polygon GeoJSON действительно похож на LineString, но форма замкнута, и обычно в Polygon первая и последняя координаты являются одной и той же точкой. Пожалуйста, взгляните на пример выше.
Мультипойнт ⚪️
MultiPoint похож на набор точек на карте сокровищ. Это группа отдельных точек, каждая со своими координатами широты и долготы, и ее можно использовать для отображения местоположения нескольких объектов на карте.
Например, представьте, что вы создаете карту сокровищ, на которой показано расположение спрятанных драгоценных камней в парке. Вы можете использовать MultiPoint, чтобы отметить местоположение каждого драгоценного камня на карте. MultiPoint будет состоять из ряда отдельных точек, каждая из которых имеет свои собственные координаты, точно так же, как несколько точек на листе бумаги, чтобы показать расположение различных драгоценных камней.
Представление MultiPont GeoJSON:
{
"type": "MultiPoint",
"coordinates": [
[
-73.984,
40.748
],
[
-73.985,
40.749
],
[
-73.986,
40.75
],
[
-73.987,
40.751
]
]
}
MultiLineString 📈📉
MultiLineString в GeoJSON похож на группу путей на карте сокровищ. Это набор линий, соединяющих ряд точек, и его можно использовать для отображения нескольких маршрутов или путей между разными местами на карте.
Например, представьте, что вы делаете карту сокровищ, которая ведет к сундуку с сокровищами, и вы хотите показать три различных возможных маршрута, по которым кто-то может добраться туда. Вы можете использовать MultiLineString для рисования трех разных путей на карте, каждый из которых состоит из ряда соединенных точек.
Представление MultiLineString GeoJSON:
{
"type": "MultiLineString",
"coordinates": [
[
[
2.3415215150407676,
48.848216086115485
],
[
2.3407788857352045,
48.847325398150645
],
[
2.3380359484630446,
48.8480269147754
]
],
[
[
2.330406031247776,
48.84706528274708
],
[
2.3372693633740766,
48.84692340104834
],
[
2.3372933191584764,
48.84791656449744
]
],
[
[
2.332755904765321,
48.85020559607162
],
...,
[
2.336719866067824,
48.84788609233465
]
]
]
}
Мультиполигон 🏔🌋🏝
MultiPolygon в GeoJSON подобен группе фигур на карте сокровищ. Это набор полигонов, каждый из которых состоит из ряда соединенных точек, и его можно использовать для отображения нескольких областей или регионов на карте.
Например, представьте, что вы делаете карту сокровищ, на которой показаны различные типы земель в парке, такие как лес, луг и озеро. Вы можете использовать MultiPolygon для рисования на карте трех разных фигур, каждая из которых состоит из набора соединенных точек.
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "MultiPolygon",
"coordinates": [
[
[
[
2.291863239086439,
48.8577137262115
],
[
2.293452085617105,
48.856693553273885
],
[
2.2968403487010107,
48.85892279314069
],
[
2.2951175030651143,
48.86006886087142
],
[
2.291863239086439,
48.8577137262115
]
]
],
[
[
[
2.288226120523035,
48.86156752523257
],
[
2.2899681088877344,
48.86042149181674
],
[
2.290810388976098,
48.86063558796482
],
[
2.2909826735397587,
48.8611015587675
],
[
2.28947039792655,
48.862234983151495
],
[
2.288226120523035,
48.86156752523257
]
]
],
[
[
[
2.2912927602678224,
48.85709062155263
],
[
2.2905402133688426,
48.85661663833349
],
[
2.291917551492446,
48.855746990243716
],
[
2.2926328654095016,
48.85624492205244
],
[
2.2912927602678224,
48.85709062155263
]
]
]
]
}
}
]
}
Вот и все! Мы разобрали все основные типы элементов в GeoJSON, надеюсь, этот формат данных теперь для вас намного понятнее и проще.
И наконец, я также хотел бы поделиться с вами очень полезным инструментом для изучения и визуализации данных GeoJSON прямо в вашем браузере — https://geojson.io.
Если вы вдруг не разбираетесь в каком-то типе данных, советую попробовать в geojson.io и вы разберетесь!
Следите за обновлениями!
Свяжитесь со мной в LinkedIn 🚀
