GeoJSON для вебкарт: керівництво

2026-03-02

geojsonleafletmapboxвебкартиjavascript

GeoJSON — головний формат обміну геоданими у вебі. Усі популярні картографічні бібліотеки — Leaflet, Mapbox GL JS, OpenLayers, deck.gl — нативно підтримують GeoJSON. З osm2cdr.ru ви можете експортувати будь-яку область OpenStreetMap у GeoJSON за секунди.

Структура GeoJSON

Файл GeoJSON — це звичайний JSON з об’єктами типу FeatureCollection. Кожен Feature містить геометрію (точка, лінія, полігон) і властивості (properties) — теги OpenStreetMap: назву, тип об’єкта, адресу та інші атрибути.

Як підключити до Leaflet

Найпростіший спосіб показати GeoJSON на вебкарті:

fetch('/data/moscow-buildings.geojson')
  .then(r => r.json())
  .then(data => L.geoJSON(data, {
    style: { color: '#3388ff', weight: 1, fillOpacity: 0.3 }
  }).addTo(map));

Стилізація за властивостями

GeoJSON з osm2cdr.ru зберігає OSM-теги: highway, building, amenity, natural та інші. Це дозволяє стилізувати об’єкти за типом:

L.geoJSON(data, {
  style: function(feature) {
    if (feature.properties.building) return { color: '#e74c3c' };
    if (feature.properties.natural === 'water') return { color: '#3498db' };
    return { color: '#95a5a6' };
  }
});

Оптимізація для великих даних

GeoJSON чудово працює для малих і середніх областей (до 50 км²). Для великих територій:

GeoJSON-Seq — потоковий формат, файл завантажується порядково.
PMTiles — хмарний тайловий формат з миттєвим відображенням мільйонів об’єктів.
Векторні тайли — підвантажуються в міру навігації картою.

Інструменти для роботи з GeoJSON

geojson.io — онлайн-редактор для перегляду та правки.
Mapshaper — спрощення геометрії та конвертація.
Turf.js — просторовий аналіз прямо у браузері.
QGIS — повноцінна ГІС для складної обробки.