Что такое leaflet.js?
Leaflet — это картографическая библиотека на JavaScript с открытым исходным кодом. Как и другие подобные библиотеки, она отображает карты с помощью тайлов (от англ. tile - плитка) — повторяющихся растровых слоев небольшого размера. Эти слои выводятся рядом друг с другом, создавая впечатление единого большого изображения.
Использование тайловой структуры передает только ту часть изображения, которую видит пользователь. Такая оптимизация позволяет не только быстро загружать карту, но и сэкономить интернет-трафик.
Карты, созданные с помощью Leaflet, интерактивные. Они позволяют взаимодействовать с пользователем, например, если при клике на какое-либо место на карте нужно вывести всплывающую подсказку.
Основным преимуществом, которое выделило библиотеку среди других подобных инструментов, является его простота и легкость использования. Создать карту с помощью этой библиотеки может любой разработчик, даже если он ранее не имел опыта с картографическими системами.
Возможности библиотеки leaflet
Leaflet.js поддерживает стандартные протоколы для геоинформационных систем (ГИС): Web Map Service (WMS) и GeoJson. По-умолчанию библиотека работает с растровыми, векторными и групповыми типами объектов, но с помощью дополнительных модулей можно настроить дополнительные типы слоев.
Библиотека может работать со «скользкими» картами с мозаичными базовыми слоями, панорамированием и масштабированием, а также включать предоставленные слои. Она также выполняет различные важные задачи, например, преобразование информации в контур, взаимодействие с мышью, и функционал можно легко расширить с помощью плагинов.
Ниже перечислены основные возможности базового ядра Leaflet:
- Масштабирование;
- Адаптивная версия для мобильных устройств;
- Управление некоторыми базовыми картами;
- Использование векторных слоев;
- Использование слоев GeoJson и WMS;
- Отображение растровых изображений в виде слоев;
С помощью плагинов и дополнительного ПО можно добавить следующие функции:
- Кластеризация точек;
- Геокодирование;
- Маршрутизация;
- Просмотр улиц;
- Мини-карта;
- Загрузка данных из CSV;
- Онлайн-редактирование.
Leaflet также не является полноценной ГИС, но с помощью таких инструментов как CartoDB ей можно придать некоторые ГИС-возможности. Но если для проекта требуются сложные гибкие формы или картографические проекции, то лучше рассмотреть возможность работы с более специализированной библиотекой, например, с D3.
Преимущества и недостатки leaflet
У Leaflet можно выделить следующие преимущества:
- Простота;
- Небольшое количество кода;
- Интерактивность;
- Может использоваться с CartoDB, MapBox, Google Maps и многими другими;
- Открытый исходный код;
- Доступно множество плагинов;
- Простая и понятная документация.
При этом инструмент не лишен недостатков:
- Недостаточно возможностей для ГИС;
- Часть базовых слоев для карт платная.
Leaflet или OpenLayers — что выбрать?
Для создания карты в веб-интерфейсе чаще всего стоит выбор между двумя популярными библиотеками: Leaflet и OpenLayers. Оба инструмента бесплатные и разработаны на JavaScript. Разберем, в чем заключаются их основные отличия.
Сложность разработки
OpenLayers предлагает больше функций, чем Leaflet, но при этом требует больше времени для запуска. Например, в OpenLayers нужно использовать проекции для создания простой карты, что сильно увеличивает время разработки.
Обновления
Обе библиотеки активно поддерживаются. Обновления для Leaflet выходят примерно раз в пол года, а для Open Layers каждые 3-4 месяца.
Документация
Leaflet.js имеет хорошо структурированную документацию с большим количеством примеров и руководств. Она позволяет быстро найти необходимую функциональность.
Однако базовая документация содержит только основные примеры. Если для проекта требуется какое-то нетипичное решение, то понадобится помощь сообщества.
В OpenLayers документация содержит QuickStart, учебные пособия и множество примеров. К сожалению, некоторые из них уже устарели. Документация API хорошо структурирована, но она очень объемная.
Сообщество
Поскольку OpenLayers используется в основном для разработки сложных ГИС-приложений, его сообщество намного меньше, чем у простого и легкого Leaflet: 36 тыс. звезд на Github против 9,5 тыс.
Встроенные возможности
Базовый функционал Leaflet содержит основные функции, которые понадобятся большинству разработчиков при создании карты. Некоторые дополнительные возможности реализуются с помощью подключения плагинов. В то же время OpenLayers имеет намного больше встроенного функционала.
Количество кода
Leaflet предназначена для создания карт с минимальным количеством кода. Например, для создания простой карты с маркером понадобится всего 3 класса. В OpenLayers намного больше кода, но он выглядит более структурированным и обеспечивает лучшее MVC-разделение.
Выводы
Leaflet лучше всего подходит для проектов, в которых требуется только карта, а не разработка сложного ГИС-приложения. Если нужно иметь дело с прогнозами, проекциями и различными источниками геоданных, тогда лучше использовать другие картографические библиотеки.
Если вы сомневаетесь в выборе, то специалисты Work Solutions помогут выбрать оптимальный инструмент для реализации интерактивной карты. Наша команда разработчиков уже имеет опыт с картографией. Например, на одном из проектов мы использовали библиотеку Leaflet.js для отрисовки офисного пространства и выбора рабочих мест. Таким образом, аутстаффинг разработки поможет сэкономить средства на обучении штатных сотрудников и быстрее запустить процесс реализации функционала.