2016-01-28 16 views
39

Dal glossario Mapbox, Mapbox.jsMapbox GL JS vs. Mapbox.js

Mapbox.js è una libreria JavaScript che permette di aggiungere una vostra mappa interattiva per il vostro sito web. È un plugin per Leaflet, ed è una libreria open source che è gratis da usare.

e Mapbox GL JS

Mapbox GL JS è una libreria JavaScript che usa Mapbox GL di rendere mappe interattive. È una libreria open source che è gratuita. Puoi aggiungere uno stile Mapbox o uno stile personalizzato creato con Mapbox Studio all'applicazione Mapbox GL JS.

e da this answer

stili Mapbox sono per l'uso con Mapbox GL ei iOS native e Android SDK. Non puoi usarli con il classico Mapbox JS. Mapbox JS supporta i riquadri raster, non è possibile ridimensionarli. Sono solo immagini. Mapbox GL e l'SDK nativo (possibile) usano le tessere vettoriali e quelle sono stylable.

credo che posso usare mapbox.js come una sostituzione per i leafletcss e js fonti, ma posso fare lo stesso con mapbox-gl.js?
Quali altre differenze esistono tra le due librerie?

risposta

32

Per quanto ne so, Mapbox GL JS sarà il sostituto dell'attuale Mapbox JS che utilizza Leaflet in background. Un sacco di cose che Opuscolo fa, GL può fare anche di più. Ma non tutto. Lo stesso vale per il visto. GL può fare cose che Leaflet non può fare. La cosa importante in GL è che è costruita attorno a piastrelle vettoriali usando WebGL. Dall'articolo introduttivo:

Annunciando Mapbox GL JS - un nuovo sistema veloce e potente per le mappe web. Mapbox GL JS è un renderer lato client, quindi utilizza JavaScript e WebGL per disegnare dinamicamente i dati con la velocità e la fluidità di un videogioco. Invece di fissare stili e livelli di zoom a livello di server, Mapbox GL mette potenza in JavaScript, consentendo uno stile dinamico e l'interattività a mano libera. Le mappe vettoriali sono la prossima evoluzione e siamo entusiasti di vedere quali sviluppatori sviluppano con questo framework.

Se si desidera un confronto ravvicinato tra i due, mi dispiace che non ci sia nessuno per quanto ne so. Ci sono troppe cose da dire/prendere in considerazione quando si effettua un confronto, quindi è meglio che tu faccia una cosa del genere da solo in base alle tue esigenze.Un buon inizio sarebbe confrontando gli esempi per ciascun quadro perché dà una buona idea di ciò che entrambi possono fare:

Dopo di che si può confrontare il loro API:

Una cosa da tenere a mente è che GL è nuovo di zecca e come tutti gli sviluppatori sanno che ha un prezzo. Alcuni nodi non sono stati risolti. Per quanto riguarda Leaflet, è molto maturo, ampiamente utilizzato e molto ben collaudato/provato. Se you'de piace dare uno sguardo a quali problemi ci sono attualmente con GL si potrebbe prendere uno sguardo ai problemi sopra a Github, nel repository:

Speranza che aiuta, in bocca al lupo!

+1

Dopo aver giocato un po ', vorrei sottolineare che le due librerie non sono compatibili tra loro. Ad esempio, non posso usare 'mapbox.js' per aggiungere un' GeoJSON' a una mappa creata con 'mapbox-gl.js' – raphael

+0

Entrambi sono compatibili con le specifiche di GeoJSON? Mapbox.js che utilizza GeoJSON: https://www.mapbox.com/mapbox.js/example/v1.0.0/load-geojson/ Mapbox.GL.js che utilizza GeoJSON: https://www.mapbox.com/mapbox- gl-js/example/geojson-markers/Non capisco cosa intendi usando mapbox.js su una mappa creata da gl. Ovviamente non è possibile combinare i due framework, le loro API sono completamente differenti – iH8

+0

Leaflet 1.0 potrebbe dare a Mapbox GL una corsa per i suoi soldi: http://leafletjs.com/2015/07/15/leaflet-1.0-beta1-released. html –

19

risposta di iH8 è grande, per aggiungere un po 'più in dettaglio:

Per base di mappe, Mapbox.js visualizza i file piastrelle raster (PNG & JPEG), e li visualizza utilizzando HTML & CSS. Mapbox GL JS mostra le tessere vettoriali (buffi protocolli di protocollo) e le visualizza con WebGL. Può anche visualizzare riquadri raster, ma non è il punto focale.

Sia Mapbox.js che Mapbox GL JS supportano sovrapposizioni come livelli e marcatori GeoJSON. Entrambi sono open source, con licenze simili e alcuni contributori condivisi.

Gli stili per i layer Mapbox.js sono memorizzati su server e resi con tecnologia server. Gli stili per Mapbox GL JS sono resi dinamicamente in un browser, quindi possono essere modificati in tempo reale.

Il volantino ha un supporto browser più ampio, al costo di alcune cose che alcuni browser non supportano, come l'inclinazione e la rotazione della mappa. Mapbox GL supporta i browser che supportano WebGL e offre prestazioni migliori sui computer più recenti. Ha una versione nativa, chiamata Mapbox GL Native, che si comporta davvero bene su tutti i telefoni cellulari.

Nonostante i nomi, è possibile utilizzare Leaflet con Mapbox e Mapbox.js e Mapbox GL con stili diversi da Mapbox.

+0

Da Leaflet 1.0-beta1 (14 luglio 2015), [zoom non intero è supportato] (https://github.com/Leaflet/Leaflet/blob/master/CHANGELOG.md#animations-improvements-and-fractional- zoom) – Jieter

11

Generalmente Leafletjs e Mapbox.js sono gli stessi, ma con Mapbox.js hanno plug-in ed estensioni che avvolgono Leaflet e si legano ai servizi di Mapbox (ad esempio indicazioni stradali). Plugin e funzionalità simili esistono da altre aziende o prodotti e Leaflet può utilizzarli in aggiunta o in sostituzione di Mapbox. Le librerie basate su Leaflet in genere dispongono di un supporto legacy del browser migliore, usano riquadri raster, ecc. Si aggiungono queste funzionalità che incorporano funzionalità moderne come tiles vettoriali (pbf, mvt, ecc.) E vari renderer (incluso Webgl).

Mapbox-gl-js e la variante nativo mapbox-gl sono librerie open-source che sono alte prestazioni, altamente ottimizzato intorno piastrelle vettoriali (PBF, mvt) e WebGL per il rendering in un elemento di tela (per la variante -js). È relativamente nuovo quindi alcune cose che sono facili con Leaflet potrebbero essere diverse o impegnative (ad aprile 2016), che dicono che sono molto simili e funzionano abbastanza bene, anche sui dispositivi mobili (negli ultimi anni, ad es. iphone 5s). Un esempio di una stranezza casuale è che le etichette ebraiche in Israele, che leggono da destra a sinistra, sono arretrate e sembrano assurdità (è un problema aperto che viene affrontato).

Se il supporto del browser più vecchio è a posto, il percorso Mapbox-gl (-js) può essere una buona scelta. Nella mia limitata esperienza (lavorando con esso alcuni mesi) ha la migliore esperienza utente + sviluppatore nel complesso e Mapbox è stata coerente nella loro ingegneria/produzione. Ho meno esperienza con i loro servizi a pagamento e non è chiaro in che modo le loro librerie saranno strettamente collegate a questi servizi. Per un progetto mobile mi sono spostato su mapbox-gl-js dopo aver consultato Google Maps, Leaflet v0.7 e v1 e sembra che sia stata una buona decisione.

Ho iniziato a utilizzare Mapbox-gl-js con precedente esperienza di Leaflet e competenza in HTML/CSS/JS e trovato the primer e examples entrambi utili nella comprensione dei dettagli tecnici. Compreso il modo in cui la mappa è in stile con JSON (non CSS). Dai un'occhiata anche ai termini di servizio, questo è stato un importante elemento di differenziazione positivo in particolare rispetto a Google. I servizi di Mapbox non hanno la copertura più robusta al di fuori degli Stati Uniti, quindi assicuratevi di dare qualche recensione (nella mia esperienza un altro fornitore è generalmente disponibile, quindi questo non influisce necessariamente sulla decisione di adottare le librerie, sono solo molto strettamente collegato alle funzionalità o agli standard di Mapbox).

0

Attualmente sto lavorando per passare a Mapbox GL un sistema di mappe basato su Leaflet complesso e direi che una differenza notevole che ho riscontrato è negli strumenti di disegno e nella gestione dei layer GeoJSON. Il volantino ha una serie di strumenti per disegnare che includono marcatori, rettangoli e cerchi non standard di GeoJSON. Gli sviluppatori di Mapbox GL hanno preso la decisione di concentrarsi su GeoJSON nativo, il che significa che non esiste un supporto immediato per disegnare/rendering cerchi e rettangoli (ad esempio, non c'è niente come L.Circle in Mapbox GL); c'è un pennarello ma lo stile per sembrare un tradizionale segnalino Leaflet richiede la creazione di sprite o l'uso di un SVG. Tutte queste cose sono ancora possibili, ma richiedono un po 'più di impostazione da parte dello sviluppatore rispetto a quanto fatto in Leaflet.

Inoltre, la maggior parte dei layer Mapbox GL viene visualizzata come elementi canvas. Ciò significa che, a differenza di Leaflet, non ci sono elementi HTML associati ai vari livelli. Ciò rende più difficile il targeting degli elementi con i CSS, se necessario. Un'eccezione che ho trovato qui è marcatori che sono resi come elementi HTML separati.

Tutto ciò detto, sono riuscito a replicare quasi completamente gli strumenti di disegno esistenti e gli stili di rendering con alcune piccole differenze. Se hai bisogno di strumenti di disegno altamente personalizzati, Mapbox GL potrebbe essere frustrante per te.

Anche il supporto del browser è stato menzionato come un potenziale problema. Qualsiasi browser che supports WebGL può eseguire Mapbox GL. Questo include tutti i principali browser. L'unico set di browser significativo che abbiamo visto che non supportava Mapbox GL era IE10 o precedente, ma le nostre analisi indicavano che quasi nessuno dei nostri utenti utilizzava ancora questi browser, quindi abbiamo ufficialmente ritirato il supporto per loro. Il tuo chilometraggio può variare ovviamente.

Nel complesso, tuttavia, sono soddisfatto dello switch perché penso che Mapbox GL sia più semplice da utilizzare e offra un'esperienza utente migliore.