Leaflet.js è la libreria di mappe più semplice che troverai mai
Google Maps è sicuramente il più popolare widget di mappe integrabili per i web designer. Ma per quanto riguarda aggiungere funzionalità personalizzate come tooltip e indicatori di pin?
Questo è dove una libreria impressionante come Leaflet.js aiuta un sacco.
Questo è un progetto open source completamente gratuito inizialmente creato da uno dei ragazzi di Mapbox chiamato Vladimir Agafonkin. Da allora, Leaflet è cresciuto fino a comprendere decine di contributori Intorno al mondo.
È frequente aggiornato con correzioni di bug e nuove funzionalità che migliorano l'implementazione generale su qualsiasi sito web. Questa è di gran lunga la mia libreria di mappatura preferita per la sua forza pura e l'estetica del design.
Ha così tante funzioni che non potrei elencarle tutte, ma qui ci sono i più interessanti:
- Accelerazione hardware mobile
- Indicatori di pin, sovrapposizioni di forme e descrizioni comandi
- Zoom personalizzato e animazione panoramica
- Nessuna dipendenza JS
- Supporto per tutti i principali browser incluso IE7+
L'implementazione è un po 'complicata perché è necessario inserire le coordinate e definire la dimensione della mappa.
Gli utenti possono sempre rimpicciolire e panoramica, quindi la vista può sempre cambiare. Ma è anche basato su come si definisce la mappa sulla pagina.
C'è un enorme pagina di documentazione pieno di informazioni per ogni aspetto di Leaflet. Purtroppo, è così denso che non posso raccomandarti di immergerti perché probabilmente ti perderai. Invece, controlla il Pagina di esercitazioni per volantini che include anche a Guida Rapida per i principianti.
Imparerai come incorpora mappe, modifica la dimensione / posizione, e come aggiungere grafica personalizzata in cima, come cerchi o segnapunti.
Questa guida introduttiva può ti insegnano tutto ciò di cui hai bisogno utilizzare Leaflet su un blog, sito Web aziendale o qualsiasi progetto imminente.
Ci sono molti buoni motivi per usare Google Maps: è potente, affidabile e gratuito. Ma Leaflet viene con così tante altre funzionalità fuori dalla scatola e tu hai solo bisogno di aggiungi i file CSS / JS alla tua pagina web per iniziare. Puoi anche trovare copie ospitate online se preferisci seguire la rotta CDN.
Non lasciare che la documentazione ti spaventi. C'è molto che puoi imparare ma non tutte le funzionalità sono necessarie per una configurazione di Leaflet di base.
E non ci vuole molto crea una mappa straordinaria da zero. Dai un'occhiata a questa demo di Codepen creata utilizzando Leaflet.js e l'API di Google Maps.
