Co dělat, když Google Maps na webu nefungují – Alternativy a řešení

Google Maps jsou jedním z nejpoužívanějších nástrojů pro zobrazování map na webových stránkách. Mnoho firem a webových projektů spoléhá na tuto službu, aby zobrazily svou polohu nebo umožnily uživatelům snadnou navigaci. Co ale dělat, když Google Maps na vašem webu přestanou fungovat? V tomto článku se podíváme na možné příčiny problému a dostupné alternativy.

Možné příčiny nefunkčních Google Maps

  1. Chybějící nebo neplatný API klíč – Od roku 2018 vyžaduje Google Maps API platný klíč a aktivní platební metodu. Pokud váš klíč není správně nastaven, mapa se nenačte.
  2. Omezený denní limit volání API – Google omezuje počet bezplatných požadavků na API. Pokud limit překročíte, mapa přestane fungovat.
  3. Chybné nastavení v JavaScriptu nebo v kódu webu – Nesprávně napsaný kód nebo konflikty s jinými skripty mohou způsobit nefunkčnost map.
  4. Blokace v prohlížeči nebo zásuvné moduly – Některé rozšíření prohlížečů nebo bezpečnostní nastavení mohou bránit načítání Google Maps.
  5. Vypršení platnosti platebního účtu v Google Cloud Console – Pokud máte neaktualizované fakturační údaje, Google může mapovou službu zablokovat.

Jak opravit nefunkční Google Maps

  • Zkontrolujte API klíč – Ujistěte se, že máte správně vygenerovaný a aktivní API klíč v Google Cloud Console.
  • Zkontrolujte konzoli vývojáře v prohlížeči (F12 -> Console) – Pokud je v kódu chyba, zde se zobrazí podrobnosti.
  • Ověřte limity API v Google Cloud Console – Pokud je limit překročený, může být nutné upgradovat plán nebo optimalizovat požadavky na API.
  • Ujistěte se, že je platební metoda aktuální – Google vyžaduje propojení s fakturačním účtem, i když používáte pouze bezplatné limity.

Jak vložit Google Maps pomocí iframe

Pokud chcete na web vložit Google Maps bez použití API, můžete použít jednoduchý iframe:

<iframe
  width="100%"
  height="400"
  frameborder="0"
  style="border:0"
  src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2624.9909441411454!2d2.292292415674595!3d48.85884407928706!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47e66fbd010b48c3%3A0x421218f3c77f4e73!2sEiffel%20Tower!5e0!3m2!1sen!2sus!4v1647278393976!5m2!1sen!2sus"
  allowfullscreen>
</iframe>

Tento způsob nevyžaduje API klíč, ale neumožňuje pokročilé přizpůsobení mapy.

Alternativy k Google Maps

Pokud Google Maps nefungují nebo nechcete být závislí na této placené službě, můžete zvážit následující alternativy:

1. OpenStreetMap (OSM) – Svobodná a bezplatná alternativa

OpenStreetMap (OSM) je komunitní projekt, který nabízí podrobné a aktuální mapové podklady zdarma.

Výhody:

  • Žádné poplatky za používání
  • Možnost přizpůsobení vzhledu mapy
  • Aktivní komunita a pravidelné aktualizace

Jak integrovat OpenStreetMap:

<iframe width="100%" height="400" frameborder="0" scrolling="no"
    src="https://www.openstreetmap.org/export/embed.html?bbox=14.4000,50.0500,14.5000,50.1000&layer=mapnik">
</iframe>

2. Leaflet.js – Interaktivní mapy s OSM

Leaflet.js je populární JavaScriptová knihovna pro práci s OpenStreetMap a dalšími mapovými podklady.

Ukázkový kód pro implementaci:

<div id="map" style="height: 400px;"></div>
<script>
  var map = L.map('map').setView([50.0755, 14.4378], 13);
  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; OpenStreetMap contributors'
  }).addTo(map);
</script>

3. Mapbox – Prémiová alternativa s vysokou kvalitou

Mapbox je placená alternativa s širokou škálou funkcí a možností úprav.

Výhody:

  • Vysoká kvalita mapových podkladů
  • Možnost přizpůsobení vzhledu mapy
  • API podobné Google Maps

Nevýhoda:

  • Omezené bezplatné volání API, poté je nutné platit

Závěr

Pokud vám Google Maps přestanou fungovat, nejprve ověřte správnost API klíče, limity a fakturační údaje. Pokud se rozhodnete pro jinou alternativu, OpenStreetMap a Leaflet.js jsou skvělé bezplatné možnosti, zatímco Mapbox nabízí prémiové řešení. Výběr správné technologie závisí na vašich potřebách a rozpočtu.

Získejte moderní web na míru