Posts Tagged ‘iframe’

Donnerstag, 13. November 2014

Google Maps in eigene Web-Site integrieren

Damit man Google Maps-Karten in die eigene Web-Site integrieren kann, benötigt man ein Google-Konto und Zugriff auf die Google Developers Console.

Dort findet man im Menupunkt APIs & Auth in der Unterrubrik APIs die „Google Maps Embed API“, welche man dort auch gleich für die Verwendung aktiviert.

Um Missbrauch zu verhindern, sollte man zudem im Menupunkt Credentials unter Public API Access einen API Key für die Google Maps Embed API erstellen und bei Referers dann die Domainnamen erfassen, von welchen die Requests für Kartendaten kommen dürfen (Referer lassen sich selbstverständlich fälschen, aber ich gehe davon aus, dass Google Gegenmassnahmen in seinen serverseitigen Embed-Code eingebaut hat).

Auf der eigenen Web-Site fügt man dann das iFrame beispielsweise folgendermassen ein:

<iframe
  width="850"
  height="550"
  frameborder="0"
  style="border:0"
  class="map"
  src="https://www.google.com/maps/embed/v1/place?key=%ApiKey%&q=Bern+Switzerland&zoom=10">
</iframe>

Quelle: Google Maps Embed API

Tags: , , , , , ,
Labels: Web

Keine Kommentare | neuen Kommentar verfassen