Leaflet.js är det enklaste kartbiblioteket du någonsin kommer att hitta
Google Maps är säkert den mest populära inbeddable map widget för webbdesigners. Men vad sägs om lägger till anpassade funktioner till exempel verktygstips och stiftmarkörer?
Det här är ett fantastiskt bibliotek som Leaflet.js hjälper ett ton.
Det här är en helt gratis open source-projekt ursprungligen skapad av en av killarna på Mapbox med namnet Vladimir Agafonkin. Sedan dess har bladen vuxit till att omfatta dussintals bidragsgivare runt världen.
Det är ofta uppdaterad med buggfixar och nya funktioner som förbättrar det övergripande genomförandet på vilken webbplats som helst. Detta är överlägset min favorit kartläggning bibliotek på grund av sin rena kraft och design estetiska.
Det har så många funktioner som jag inte skulle kunna lista dem alla, men här är de mest intressanta:
- Mobil hårdvaruacceleration
- Stift markörer, form överlagringar och verktygstips
- Anpassad zoom och panorering animering
- Inga JS beroenden
- Stöd för alla större webbläsare, inklusive IE7+
Genomförandet är lite knepigt eftersom du behöver skriv in koordinater och Definiera hur stor kartan ska vara.
Användare kan alltid zooma ut och panorera runt, så vyn kan alltid förändras. Men det är också baserat på hur du definierar kartan på sidan.
Det är en enorm dokumentationssida full av information för alla aspekter av broschyren. Tyvärr är det så tätt att jag inte kan rekommendera att bara dyka in i det eftersom du förmodligen kommer vilse. I stället kolla in Sida för handledning av broschyr som också innehåller en Snabbstartsguide för nybörjare.
Du lär dig hur du ska bädda in kartor, ändra storlek / position, och hur man gör det lägg till anpassad grafik på toppen, som cirklar eller stiftmarkörer.
Den här introguiden kan lär dig allt du behöver att använda Leaflet på en blogg, företagswebbplats eller något kommande projekt.
Det finns många bra skäl att använda Google Maps: det är kraftfullt, betrodat och gratis. Men bipacksedel kommer med så många fler funktioner ur lådan och du behöver bara lägg till CSS / JS-filerna på din webbsida för att starta. Du kan även hitta kopior som är värd online om du föredrar att gå på CDN-rutten.
Låt inte dokumentationen skrämma dig bort. Det finns mycket du kan lära dig men inte alla funktioner är nödvändiga för en grundläggande bladinstallation.
Och det tar inte mycket för skapa en fantastisk karta från början. Ta en titt på den här Codepen-demo som skapats med hjälp av Leaflet.js och Google Maps API.
