Jak vložit na svůj web mapu? Zjistěte, jaké jsou vaše možnosti

Obligátní Google Mapy

API klíč a zadání karty

V roce 2018 Google změnil licenční podmínky vkládání map na web. K tomu, abyste mohli naplno využívat služby Google Mapy, je potřeba udělat registraci na vlastní Google účet a získat API klíč. Přečtěte si návod,  jak si sami vytvoříte API klíč .

Pokud chcete vkládat vlastní prvky do Google Map, není to zadarmo

Google Mapy jsou placenou službou, ale konečná částka se odvíjí od návštěvnosti na vašem webu a od toho, zda budete chtít dělat úpravu map (například vložit vlastní ikonu s logem). Můžete je mít zdarma, nebo kvůli nim budete muset sáhnout hlouběji do kapsy. Ale pojďme popořadě.

Jak je to s placenými Google Mapami

Prvním krokem ještě před samotnou implementací webu je propojení vašeho účtu s platební kartou. Za to dostáváte od Googlu každý měsíc voucher na 200 dolarů. Za jak dlouho tento kredit vyčerpáte, závisí především na množství úprav, které v mapách provedete. Máte-li menší web, vystačíte si s poukázkou a nemusíte platit nic. Větší weby pak doplácejí podle množství zobrazení map nad rámec voucheru.

V Google Maps získáte mnoho funkcí

Google Mapy nabízí mnoho různých funkcí: můžete do mapy umístit ikonu korespondující s logem webu, zaznamenat všechny pobočky firmy nebo třeba jen ty, které jsou vaší poloze nejblíž. Ukážou vám trasu k prodejně, streetview nebo – chcete-li – vymezí pole celého firemního pozemku. 

Pouhé vložení mapy na web lze samozřejmě provést i bez API klíče, ale místo vlastní ikonky Google zobrazí klasický špendlík.

Google Mapy vol. 2 vložení přes iframe

Ušetřete díky iframe

Na Google Mapy však můžete jít i od lesa a bez nutnosti vložení skrze API klíče. Možností je totiž vložení map na web prostřednictvím iframe kódu. Dovede zobrazit základní mapu: místo prodejny, sídlo společnosti nebo všechny pobočky najednou. Ideální volba pro jednodušší web. 

Alternativa pro jednoduchý web

Omezením je v tomto případě absence customizace map a výběru vlastní ikonky. Na druhou stranu si můžete vybrat z velkého množství předvytvořených ikonek v různých barvách. 

Jak se nám podařilo vsadit Google Mapy přes iframe, se můžete podívat na webech našich klientů OKM Group nebo Buse. Svou vlastní iframe mapu s body lze vložit přímo z Google Map.

Jde to i hezky česky: OpenStreetMap

Zapojte se do tvorby map i vy

Česká platforma, kterou dnes sestavují tisíce dobrovolníků po celém světě – to je OpenStreetMap. Žádné licence, žádné poplatky, žádné poskytování platebních údajů. Mapy jsou zkrátka zdarma a do jejich tvorby se můžete zapojit klidně i vy sami. OpenStreetMap nabízí až 50 tisíc zobrazení za měsíc. 

Interaktivita má zelenou

OpenStreetMap je interaktivní a umožňuje dělat všelijaké úpravy. Dokážeme vám tak vytvořit vyhledávač míst, zakreslit značky, přidat popisky, flash animace a mnoho dalšího. A pokud vám nevadí si trochu připlatit, pak máte možnost zvolit si i libovolný podklad map. Tady ale počítejte s nutností registrace a zadání platebních údajů. Více informací nebo variant map najdete na stránce Mapbox.

Vložení mapy na web zajistíme za vás

Vaše kreativní já se tu se všemi možnostmi skutečně vyřádí. Vložení OpenStreetMap na web nevyžaduje vlastnictví API klíče. Pokud o tento typ map na svém webu stojíte, není nutná vaše asistence – s vložením si poradíme hravě sami. Ukázkou tohoto typu map nám mohou být například weby PUX klientů TerraHunt nebo LAC – posuďte sami.

Seznam a Mapy.cz

Vložte si Mapy.cz přes API klíč

Pozadu nezůstává ani Seznam. Mapy.cz jsou české a svůj web jimi můžete obohatit zdarma. Na rozdíl od Google Map si tady se zakládáním účtu nemusíte lámat hlavu. Mapy.cz fungují prostřednictvím API klíče. A protože jsme map od Seznamu nasadili už spoustu, opět není potřeba vaší asistence při jejich implementaci na web. 

Customizovatelnost map díky API klíči

Velkou výhodou Seznam map s API klíčem je jejich customizovatelnost. Díky tomu můžete svým návštěvníkům nabídnout kupříkladu funkci dohledávání svých poboček nebo obchodů podle krajů i měst. To byl také požadavek klientů KDU-ČSL a Babyliss, kterým jsme na web umístili mapu s filtrováním.

Varianta Mini API

Fajn je jistě lokalizace map do slovenštiny, němčiny a angličtiny. Pro snadnější hledání navíc Mapy.cz nabízí i možnost využití filtrování podle krajů, měst, nejméně vytížených či uzavřených tras při cestování. Seznam rozjel dokonce i variantu Mini API, která je jednodušší, rychlejší a není interaktivní. Ideální, pokud vám stačí vložit na web jen malou statickou mapu s libovolnou značkou.

Plnohodnotná náhrada Google: Leaflet

Jednoduchý základ a mnoho pluginů

Mít na webu interaktivní mapu, kterou je možné používat i na mobilu? Seznamte se s Leaflet. Je jednoduchý, výkonný a na JavaScriptu zabere pouhých 39 KB. Kromě základu však nabízí i rozšíření o řadu užitečných pluginů, například teplotní mapy či geolokaci. Svými dovednostmi se tak vyrovná i klasickým Google mapám. A ať už používáte k surfování jakýkoliv prohlížeč či zařízení, tento software bude fungovat hladce. 

Leaflet jako open-source

Stejně jako u Google map, i zde se mapy vkládají na web prostřednictvím API. S tím rozdílem, že Leaflet je open-source. To znamená, že má otevřený zdrojový kód i licenci a můžete ho mít na svém webu zdarma. 

Zaujaly vás dovednosti některé z výše zmíněných map? V PUXdesign dokážeme vložit a nastavit na web Google Mapy přes API a iframe, OpenStreetMap a Seznam Mapy. Uvažujete-li o mapách, chcete poradit nebo je rovnou implementovat na web,  ozvěte se nám .