Leaflet.js je nejjednodušší mapová knihovna, kterou kdy najdete
Mapy Google jsou určitě nejoblíbenější widget pro vloženou mapu pro webové designéry. Ale co přidávání vlastních funkcí například popisky nástrojů a značky pinů?
Zde je úžasná knihovna Leaflet.js pomáhá tunu.
Toto je zcela zdarma open source projekt původně vytvořil jeden z kluků v Mapboxu jménem Vladimir Agafonkin. Od té doby společnost Leaflet rozrostla desítky přispěvatelů okolo světa.
Je to často aktualizovány pomocí oprav chyb a nových funkcí které zlepšují celkovou implementaci na jakékoli webové stránce. Toto je zdaleka moje oblíbená mapovací knihovna kvůli své naprosté síle a estetice designu.
Má tolik funkcí, že jsem je nemohla vypsat všechny, ale tady ty nejzajímavější:
- Zrychlení mobilního hardwaru
- Značky pinů, překryvy tvaru a popisky nástrojů
- Vlastní animace přiblížení a posouvání
- Žádné závislosti na JS
- Podpora pro všechny hlavní prohlížeče včetně IE7+
Realizace je trochu složitější, protože potřebujete zadejte souřadnice a definovat, jak velká by měla být mapa.
Uživatelé mohou vždy oddálit a kolem, takže pohled se může vždy změnit. Ale je to také založeno na jak definovat mapu na stránce.
Je tu obrovský dokumentace plné informací pro každý aspekt letáku. Je smutné, že je to tak husté, že do něj nemohu doporučit jen potápění, protože se pravděpodobně ztratíte. Místo toho, podívejte se na Leták tutoriály stránky který také zahrnuje rychlý návod pro začátečníky.
Naučíte se to Vložení map, změna velikosti / pozice, a jak na to přidat vlastní grafiku nahoře, jako jsou kruhy nebo značky pinů.
Tento jeden úvodní průvodce může vás naučí vše, co potřebujete používat leták na blogu, na webových stránkách společnosti nebo na nějakém připravovaném projektu.
Existuje mnoho skvělých důvodů, proč používat Mapy Google: je to mocné, důvěryhodné a bezplatné. Ale leták přichází s tolik dalších funkcí z krabice a jen potřebujete přidejte soubory CSS / JS na webovou stránku začít. Můžete dokonce najít online kopií pokud chcete jít na trasu CDN.
Nedovolte, aby vás dokumentace děsila. Je toho hodně, co se můžete naučit ne všechny funkce jsou nutné pro základní nastavení letáku.
A to moc netrvá vytvořit úžasnou mapu od nuly. Podívejte se na toto demo vytvořené Codepen pomocí rozhraní API služby Leaflet.js & Mapy Google.