Mapbox GL JS против Mapbox.js

Из глоссария Mapbox Mapbox.js

Mapbox.js - это библиотека JavaScript, которая позволяет вам добавить вашу интерактивную карту на ваш сайт. Это плагин для Leaflet, и это бесплатная библиотека для использования.

и Mapbox GL JS

Mapbox GL JS - это библиотека JavaScript, которая использует Mapbox GL для визуализации интерактивных карт. Его библиотека с открытым исходным кодом доступна для использования. Вы можете добавить стиль Mapbox или собственный стиль, созданный с помощью Mapbox Studio, в приложение Mapbox GL JS.

и этот ответ

Стили Mapbox предназначены для использования с Mapbox GL и родными iOS и Android SDK. Вы не можете использовать их с классической версией Mapbox JS. Mapbox JS поддерживает растровые фрагменты, вы не можете их стилизовать. Это просто образы. Mapbox GL и родной SDK (могут) использовать векторные плитки, и они стилизованы.

Я полагаю, что я могу использовать mapbox.js как замену источникам leaflet css и js, но могу ли я сделать то же самое с mapbox-gl.js?
Какие еще существуют различия между двумя библиотеками?

Ответ 1

Насколько я знаю, Mapbox GL JS будет заменой нынешнего Mapbox JS, который использует Leaflet в фоновом режиме. Многое из того, что делает Leaflet, GL может делать и многое другое. Но не все. То же самое и наоборот. GL может делать то, что не может делать Leaflet. Самое важное в GL - это то, что он построен вокруг векторных плиток с использованием WebGL. Из вступительной статьи:

Анонс Mapbox GL JS - новая быстрая и мощная система для веб-карт. Mapbox GL JS является средством визуализации на стороне клиента, поэтому он использует JavaScript и WebGL для динамического рисования данных со скоростью и плавностью видеоигры. Вместо того, чтобы фиксировать стили и уровни масштабирования на уровне сервера, Mapbox GL добавляет мощность в JavaScript, обеспечивая динамическое моделирование и интерактивность произвольной формы. Векторные карты - это следующая эволюция, и мы рады видеть, что разработчики создают с помощью этого фреймворка.

Если вы действительно хотите сравнить два из них, извините, насколько я знаю, их нет. При сравнении необходимо упомянуть слишком много вещей, поэтому лучше всего делать это самостоятельно, исходя из своих собственных требований. Хорошим началом будет сравнение примеров для каждой среды, потому что это дает хорошее представление о том, что могут сделать оба:

После этого вы можете сравнить их API:

Нужно иметь в виду, что GL - это новинка, и, как мы все разработчики знаем, это имеет цену. Некоторые изгибы не были сглажены. Что касается Leaflet, то он очень зрелый, широко используемый и очень хорошо проверенный/проверенный. Если вы хотите взглянуть на проблемы, которые существуют в настоящее время с GL, вы можете взглянуть на проблемы в Github в репозитории:

https://github.com/mapbox/mapbox-gl-js/issues

Надеюсь, что это помогает, удачи!

Ответ 2

Ответ iH8 велик, чтобы добавить немного более подробно:

Для базовых карт Mapbox.js отображает файлы растровых фрагментов (PNG и JPEG) и отображает их с помощью HTML и CSS. Mapbox GL JS отображает векторные фрагменты (фэнтезийные буферы протоколов) и отображает их с помощью WebGL. Он также может отображать растровые фрагменты, но это не фокус.

Оба Mapbox.js и Mapbox GL JS поддерживают накладки, такие как слои и маркеры GeoJSON. Оба являются с открытым исходным кодом, с похожими лицензиями и несколькими совместно используемыми участниками.

Стили для слоев Mapbox.js хранятся на серверах и отображаются с использованием технологии сервера. Стили для Mapbox GL JS отображаются динамически в браузере, поэтому их можно изменить в реальном времени.

Листовка имеет более широкую поддержку браузера, ценой нескольких вещей, которые некоторые браузеры не могут поддерживать, например, наклон карты и вращение. Mapbox GL поддерживает браузеры, которые поддерживают WebGL и лучше всего работают на более новых компьютерах. Он имеет собственную версию, называемую Mapbox GL Native, которая отлично работает на всех мобильных телефонах.

Несмотря на имена, вы можете использовать Листовку с Mapbox и Mapbox.js и Mapbox GL с не-Mapbox стилями.

Ответ 3

Обычно Leafletjs и Mapbox.js являются теми же, но с Mapbox.js, имеющими плагины и расширения, которые обертывают Листовку и привязывают к сервисам Mapbox (например, направлениям). Подобные плагины и функции существуют от других компаний или продуктов, и Листовка может использовать их в дополнение к или вместо Mapbox. Библиотеки, основанные на лифтах, обычно имеют улучшенную поддержку браузера, используют растровые фрагменты и т.д. Эти функции добавляются с использованием современных функций, таких как векторные фрагменты (pbf, mvt и т.д.) И различные средства визуализации (включая webgl).

Mapbox-gl-js и собственный вариант mapbox-gl - это библиотеки с открытым исходным кодом, которые являются высокопроизводительными, высоко оптимизированными вокруг векторных плит (pbf, mvt) и webgl для рендеринга в элемент холста (для варианта -js). Это относительно новое, поэтому некоторые вещи, которые легки с Leaflet, могут быть разными или сложными (по состоянию на апрель 2016 года), что они очень похожи и работают достаточно хорошо, , в том числе на мобильных устройствах (из последние несколько лет, например, iphone 5s). Примером случайной причуды является то, что ивритские ярлыки в Израиле, которые читаются справа налево, отстают и выглядят глупостями (речь идет о открытой проблеме).

Если отказаться от поддержки старых браузеров, все в порядке, если маршрут Mapbox-gl (-js) может быть прекрасным выбором. В моем ограниченном опыте (работа с ним несколько месяцев) он обладает лучшими возможностями для пользователей и разработчиков в целом, а Mapbox является последовательным в их разработке/выходе. У меня меньше опыта с оплаченными услугами, и неясно, насколько тесно связаны их библиотеки с этими услугами. Для мобильного проекта я перешел в mapbox-gl-js, посмотрев на Карты Google, Leaflet v0.7 и v1, и это, кажется, было хорошим решением.

Я начал использовать Mapbox-gl-js с опытом Leaflet и властью в HTML/CSS/JS и нашел праймер и examples обе полезны в понимании технических деталей. Включение способа отображения карты с помощью JSON (а не CSS). Также внимательно ознакомьтесь с условиями обслуживания, это был важный положительный дифференциатор особенно по сравнению с Google. Услуги Mapbox не имеют наиболее надежного покрытия за пределами США, поэтому обязательно дайте этот обзор также (по моему опыту, обычно доступен другой провайдер, так что это не обязательно влияет на решение принять библиотеки, они просто очень тесно связан с функциями или стандартами Mapbox).

Ответ 4

В настоящее время я работаю над переключением сложной системы карт на основе Leaflet на Mapbox GL, и я бы сказал, что я обнаружил одно заметное отличие в инструментах рисования и обработке слоев GeoJSON. Leaflet имеет набор инструментов рисования, которые включают нестандартные GeoJSON, такие как маркеры, прямоугольники и круги. Разработчики Mapbox GL приняли решение сосредоточиться на нативном GeoJSON, что означает, что нет встроенной поддержки рисования/рендеринга кругов и прямоугольников (например, нет ничего похожего на L.Circle в Mapbox GL); маркер есть, но для его оформления, похожего на традиционный маркер Leaflet, необходимо создать собственные спрайты или использовать SVG. Все эти вещи все еще возможны, но они требуют от разработчика немного больше настройки, чем в Leaflet.

Кроме того, большинство слоев Mapbox GL отображаются как элементы canvas. Это означает, что, в отличие от Leaflet, нет никаких элементов HTML, связанных с вашими различными слоями. Это затрудняет нацеливание элементов с помощью CSS, если это необходимо. Единственное исключение, которое я нашел здесь, это маркеры, которые отображаются как отдельные элементы HTML.

Несмотря на все сказанное, я смог почти полностью воспроизвести существующие инструменты рисования и стили рендеринга с некоторыми небольшими отличиями. Если вам нужны специализированные инструменты для рисования, Mapbox GL может вас расстроить.

Поддержка браузера также упоминалась как потенциальная проблема. Любой браузер, который поддерживает WebGL, может запустить Mapbox GL. Это включает в себя все основные браузеры. Единственный значительный набор браузеров, который мы видели, который не поддерживал Mapbox GL, был IE10 или старше, но наша аналитика показала, что почти никто из наших пользователей все еще не использовал эти браузеры, поэтому мы официально прекратили их поддержку. Ваш пробег может меняться, очевидно.

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

Ответ 5

Если вы планируете рендерить более 10 карт на страницу, я бы рекомендовал не использовать mapbox-gl. Mapbox-gl использует WebGl для динамического рисования карт. Хотя все современные браузеры поддерживают WebGl, мы столкнулись с проблемами при открытии слишком большого количества контекстов WebGl. Слишком много субъективно и зависит от того, какой именно браузер использует ваш клиент. Количество контекстов также, по-видимому, не зависит от табуляции, поэтому, если у вашего клиента есть открытая вкладка, которая уже использует "слишком много" контекстов, ваши карты могут не отображаться как следствие.

Смотрите ниже пару связанных проблем:

https://github.com/mapbox/mapbox-gl-js/issues/6312

https://github.com/mapbox/mapbox-gl-js/issues/7332

Я никогда не использовал mapbox.js или буклет в этом отношении, но для страниц, которые требуют 10 или более карт, я определенно рекомендую не использовать mapbox-gl.

Ответ 6

Mapbox.js устарел, используйте Mapbox GL JS, как указано на их веб-сайте:

Mapbox.js

Больше не в активном развитии

Поддерживает растровые плитки

Плитки генерируются сервером

Стили карты нельзя изменить в браузере, но наложения карты можно стилизовать динамически
Mapbox GL JS

В активной разработке - мы добавляем новые функции, улучшаем существующие и исправляем ошибки

Поддерживает векторные плитки

Карты отображаются на стороне клиента браузером

Данные и стили карты могут быть изменены динамически

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