Leaflet.js est la bibliothèque de cartes la plus simple que vous puissiez trouver
Google Maps est certainement le plus populaire widget de carte intégrable pour les concepteurs de sites Web. Mais qu'en est-il ajout de fonctionnalités personnalisées tels que les info-bulles et les marqueurs de broches?
C’est là qu’une bibliothèque géniale, comme Leaflet.js aide une tonne.
C'est un projet open source totalement gratuit initialement créé par l'un des membres de Mapbox, Vladimir Agafonkin. Depuis lors, Leaflet s'est développé pour inclure des dizaines de contributeurs autour du monde.
C'est souvent mis à jour avec des corrections de bugs et de nouvelles fonctionnalités qui améliorent la mise en œuvre globale sur n'importe quel site Web. C’est de loin ma bibliothèque de cartographie préférée en raison de sa force et de son esthétique..
Il a tellement de fonctionnalités que je ne pourrais pas toutes les énumérer, mais voici les plus intéressants:
- Accélération matérielle mobile
- Épingler des marqueurs, des superpositions de formes et des info-bulles
- Animation personnalisée avec zoom et panoramique
- Aucune dépendance JS
- Prise en charge de tous les principaux navigateurs, y compris IE7+
La mise en œuvre est un peu délicate car vous devez entrer les coordonnées et définir la taille de la carte.
Les utilisateurs peuvent toujours Dézoomer et faire le tour, donc la vue peut toujours changer. Mais c'est aussi basé sur comment vous définissez la carte sur la page.
Il y a un énorme page de documentation plein d'informations pour chaque aspect de Leaflet. Malheureusement, c'est tellement dense que je ne peux pas vous recommander d'y plonger, car vous allez probablement vous perdre. Au lieu de cela, consultez le Feuillet de tutoriels qui comprend également un Guide de démarrage rapide pour les débutants.
Vous apprendrez à intégrer des cartes, changer la taille / position, et comment ajouter des graphiques personnalisés sur le dessus, comme des cercles ou des marqueurs.
Ce guide d'intro peut vous apprendre tout ce dont vous avez besoin utiliser Leaflet sur un blog, un site Web d'entreprise ou tout projet à venir.
Il existe de nombreuses bonnes raisons d'utiliser Google Maps: puissant, fiable et gratuit. Mais Leaflet est livré avec tellement plus de fonctionnalités hors de la boîte et il vous suffit de ajouter les fichiers CSS / JS à votre page Web pour commencer. Vous pouvez même trouver copies hébergées en ligne si vous préférez emprunter la voie du CDN.
Ne laissez pas la documentation vous effrayer. Il y a beaucoup de choses que tu peux apprendre mais toutes les fonctionnalités ne sont pas nécessaires pour une configuration de base Leaflet.
Et ça ne prend pas grand chose à créer une carte étonnante à partir de zéro. Jetez un coup d'oeil à cette démo de Codepen créée Utilisation de Leaflet.js et de l'API Google Maps.