Es kann losgehen!

Bevor Sie mit der Entwicklung beginnen, lesen Sie bitte unsere Entwicklerdokumentation.

Die Google Maps JavaScript API aktivieren

Zum Einstieg führen wir Sie durch die Google Developers Console, wo Sie vorab Folgendes tun müssen:

  1. Ein Projekt erstellen oder auswählen
  2. Die Google Maps JavaScript API und zugehörige Dienste aktivieren
  3. Zugehörige Schlüssel erstellen
Weiter

Places-Bibliothek

Übersicht

Mithilfe der Funktionen der Google Places JavaScript-Bibliothek können Sie mit Ihrer Anwendung nach Orten suchen (in dieser API als Einrichtungen, geografische Orte oder bekannte Sehenswürdigkeiten definiert), die in einem definierten Bereich liegen, z. B. den Grenzen einer Karte oder im Umkreis eines Fixpunktes.

Google Places API bietet eine Autovervollständigungsfunktion, die Sie dazu verwenden können, um dieselbe automatische Sucherkennung zu erhalten wie im Suchfeld von Google Maps. Wenn ein Benutzer beginnt, eine Adresse einzugeben, wird durch die automatische Vervollständigung der Rest ausgefüllt. Weitere Informationen finden Sie in der Dokumentation zur automatischen Vervollständigung.

Erste Schritte

Bevor Sie die Places-Bibliothek in der Google Maps JavaScript API verwenden, müssen Sie zuerst sicherstellen, dass der Google Places API Web Service in der Google API Console im gleichen Projekt, das Sie für die Google Maps JavaScript API eingerichtet haben, aktiviert ist.

So zeigen Sie die Liste der aktivierten APIs an:

  1. Navigieren Sie zu Google API Console.
  2. Klicken Sie auf die Schaltfläche Select a project, wählen Sie das Projekt aus, das Sie für die Google Maps JavaScript API eingerichtet haben, und klicken Sie auf Open.
  3. Suchen Sie in der Liste der APIs im Dashboard nach Google Places API Web Service.
  4. Wenn die API in der Liste angezeigt wird, sind Sie startbereit. Wenn die API nicht in der Liste enthalten ist, aktivieren Sie sie:
    1. Wählen Sie oben auf der Seite ENABLE API aus, um den Tab Library anzuzeigen. Alternativ können Sie im Menü auf der linken Seite Library auswählen.
    2. Suchen Sie nach Google Places API Web Service und wählen Sie den Eintrag dann in der Ergebnisliste aus.
    3. Wählen Sie ENABLE aus. Nachdem der Vorgang abgeschlossen ist, wird die Google Places API Web Service in der Liste der APIs im Dashboard angezeigt.

Laden der Bibliothek

Der Places-Dienst ist eine eigenständige Bibliothek, die unabhängig vom Maps JavaScript API-Hauptcode ist. Um die in dieser Bibliothek enthaltenen Funktionen nutzen zu können, müssen Sie die Bibliothek zunächst mithilfe des Parameters libraries in die Maps API Bootstrap-URL laden:

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places"></script>

Weitere Informationen finden Sie unter Übersicht über Bibliotheken.

Nutzungsbeschränkungen und Richtlinien

Kontingente

Der Google Places API Web Service und die automatische Vervollständigung von Orten haben ein gemeinsames Nutzungskontingent, das in der Dokumentation zu Nutzungsbeschränkungen für Google Places API Web Service beschrieben ist. Diese Nutzungsbeschränkungen gelten auch bei Verwendung der Places Library in the Google Maps JavaScript API. Die Tagesnutzung wird als Summe der kombinierten clientseitigen und serverseitigen Anforderungen berechnet.

Richtlinien

Die Nutzung der Places Library in the Google Maps JavaScript API muss im Einklang mit den für den Google Places API Web Service beschriebenen Richtlinien erfolgen.

Ortssuchen

Mit dem Places-Dienst können Sie vier verschiedene Suchvorgänge ausführen.

  • Nearby Search gibt, basierend auf dem Benutzerstandort, eine Liste von nahegelegenen Orten zurück.
  • Text Search gibt, basierend auf einer Suchzeichenfolge, eine Liste von nahegelegenen Orten zurück, z. B. „Pizza“.
  • Radar Search gibt eine Liste von Orten innerhalb eines definierten Suchradius zurück. Die Ergebnisse sind jedoch weniger detailliert als bei „Nearby Search“ oder „Text Search“.
  • Anforderungen bezüglich Ortsdaten geben detailliertere Informationen zu einem bestimmten Ort, einschließlich Benutzerbewertungen, zurück.

Die zurückgegebenen Daten können Einrichtungen, wie Restaurants, Geschäfte und Büros, oder auch Geocoding-Ergebnisse, wie Adressen, politische Einheiten, z. B. Städte und Gemeinden, oder andere Sehenswürdigkeiten umfassen.

Nearby Search-Anforderungen

Mit einer Nearby Search-Anforderung können Sie nach Orten innerhalb eines bestimmten Bereichs nach Stichwort oder Typ suchen. Eine Nearby Search-Anforderung muss immer einen Standort enthalten, der in einer der beiden folgenden Formen anzugeben ist:

  • LatLngBounds.
  • Als kreisförmiger Bereich als Kombination der Eigenschaft location, die den Mittelpunkt des Kreises als Objekt LatLng angibt, und einem Radius, gemessen in Metern.

Eine Nearby Search-Anforderung wird gestartet, indem Sie die Methode nearbySearch() von PlacesService, aufrufen. Das Ergebnis des Aufrufs ist ein Array mit Objekten vom Typ PlaceResult. Beachten Sie, dass ab Version 3.9 die Methode nearbySearch() die Methode search() ersetzt.

service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, callback);

Diese Methode verwendet eine Anforderung mit folgenden Feldern:

  • Entweder:
    • bounds; dies muss ein Objekt google.maps.LatLngBounds sein, mit dem der rechteckige Suchbereich definiert wird; oder
    • ein Feld location und ein Feld radius; das erste Feld verwendet ein Objekt google.maps.LatLng, und das zweite verwendet eine einfache Ganzzahl, die den Kreisradius in Metern angibt. Der maximal zulässige Radius beträgt 50.000 Meter. Beachten Sie Folgendes: Wenn rankBy auf DISTANCE festgelegt ist, müssen Sie ein Feld location angeben, können aber kein Feld radius oder bounds angeben.
  • keyword (optional) — ein Begriff der mit allen verfügbaren Feldern abzugleichen ist, einschließlich, aber nicht ausschließlich Name, Typ und Adresse sowie Kundenbewertungen oder andere Inhalte von Dritten.
  • minPriceLevel und maxPriceLevel (optional) — beschränkt die Ergebnisse auf Orte innerhalb des angegebenen Bereichs. Werte von 0 (am preisgünstigsten) bis einschließlich 4 (am teuersten) sind zulässig.
  • name (optional) — ein Begriff, der mit allen Ortsnamen abzugleichen ist. Die Ergebnisse werden auf die Einträge beschränkt, die den übergebenen Namenswert enthalten. Beachten Sie, dass mit einem Ort zusätzlich zum aufgeführten Namen noch weitere Namen verbunden sein können. Von der API wird versucht, den übergebenen Wert name mit all diesen Namen abzugleichen; dies kann die Rückgabe von Ergebnissen zur Folge haben, deren aufgeführte Namen nicht mit dem Suchbegriff übereinstimmen, jedoch ihre zugehörigen Namen.
  • openNow (optional) — ein Boolescher Wert, der angibt, dass der Places-Dienst nur die Orte zurückgeben soll, bei denen der Sendezeitpunkt der Abfrage innerhalb ihrer Öffnungszeiten liegt. Wenn Sie diesen Parameter in Ihre Abfrage einbinden, werden Orte, die keine Öffnungszeiten in der Google Places-Datenbank hinterlegt haben, nicht zurückgegeben. Wenn Sie openNow auf false setzen, hat dies keine Auswirkungen.
  • rankBy (optional) — gibt die Reihenfolge an, in der die Ergebnisse aufgeführt werden. Mögliche Werte sind:
    • google.maps.places.RankBy.PROMINENCE (Standard). Mit dieser Option werden die Ergebnisse nach ihrer Wichtigkeit sortiert. Bei der Rangfolgefunktion werden bekannte Orte innerhalb des definierten Radius gegenüber nahegelegenen Orten, die weniger bekannt sind, bevorzugt. Die Beliebtheit kann durch die Bewertung eines Ortes im Index von Google, die weltweite Bekanntheit und weitere Faktoren beeinflusst werden. Wenn google.maps.places.RankBy.PROMINENCE angegeben ist, wird der Parameter radius benötigt.
    • google.maps.places.RankBy.DISTANCE. Mit dieser Option werden die Ergebnisse in aufsteigender Reihenfolge nach ihrer Entfernung vom angegebenen Standort (Angabe von location erforderlich) sortiert. Beachten Sie, dass Sie kein benutzerdefiniertes Feld bounds und/oder radius angeben können, wenn Sie RankBy.DISTANCE angeben. Wenn Sie RankBy.DISTANCE angeben, ist mindestens eines der Felder keyword, name oder type erforderlich.
  • type — schränkt die Ergebnisse auf Orte ein, die mit dem angegebenen Typ übereinstimmen. Es kann nur ein Typ angegeben werden. (Bei Angabe mehrerer Typen werden alle Typen hinter dem ersten Eintrag ignoriert.) Weitere Informationen finden Sie in der Liste der unterstützten Typen.
  • types (verworfen) – ein Array, das einen oder mehrere unterstützte Typen enthält. Der Dienst gibt das bestmögliche Ergebnis für einen vorgegebenen Satz von Typen zurück.

Übergeben Sie außerdem eine Callbackmethode an nearbySearch(), um das Ergebnisobjekt und die Antwort von google.maps.places.PlacesServiceStatus verarbeiten zu können.

var map;
var service;
var infowindow;

function initialize() {
  var pyrmont = new google.maps.LatLng(-33.8665433,151.1956316);

  map = new google.maps.Map(document.getElementById('map'), {
      center: pyrmont,
      zoom: 15
    });

  var request = {
    location: pyrmont,
    radius: '500',
    types: ['store']
  };

  service = new google.maps.places.PlacesService(map);
  service.nearbySearch(request, callback);
}

function callback(results, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      var place = results[i];
      createMarker(results[i]);
    }
  }
}

Beispiel anzeigen (place-search.html)

Text Search-Anforderungen

Der Google Places Text Search-Dienst ist ein Webdienst, mit dem auf Grundlage einer Zeichenfolge, z. B. „Pizza in New York“ oder „Schuhgeschäfte in der Nähe von Ottawa“ Informationen über verschiedene Orte zurückgegeben werden. Der Dienst gibt eine Liste von Orten, die der Textzeichenfolge entsprechen, gemäß einem eventuellem Standort-Biasing (sofern eingestellt) als Ergebnis zurück. Das Suchergebnis enthält eine Liste mit Orten. Sie können eine Place Details-Anforderung senden, um weitere Informationen zu den zurückgegebenen Orten zu anzufordern.

Text Search-Anforderungen werden durch Aufrufen der Methode textSearch() von PlacesService gestartet.

service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);

Diese Methode verwendet eine Anforderung mit folgenden Feldern:

  • query (erforderlich): Die Zeichenfolge, nach der gesucht wird, z. B. „Restaurant“. Der Places-Dienst gibt mögliche Übereinstimmungen basierend auf dieser Zeichenfolge zurück und ordnet die Ergebnisse nach erkannter Relevanz. Dieser Parameter wird optional, wenn auch der Parameter type in der Suchabfrage verwendet wird.
  • Optional:
    • openNow — ein Boolescher Wert, der angibt, dass der Places-Dienst nur die Orte zurückgeben soll, für die der Sendezeitpunkt der Abfrage innerhalb ihrer Öffnungszeiten liegt. Wenn Sie diesen Parameter in Ihre Abfrage einbinden, werden Orte, die keine Öffnungszeiten in der Google Places-Datenbank hinterlegt haben, nicht zurückgegeben. Wenn Sie openNow auf false setzen, hat dies keine Auswirkungen.
    • minPriceLevel und maxPriceLevel — beschränkt die Ergebnisse auf Orte innerhalb der angegebenen Preisstufe. Werte von 0 (am preisgünstigsten) bis einschließlich 4 (am teuersten) sind zulässig.
    • Entweder:
      • bounds — ein Objekt google.maps.LatLngBounds, mit dem das Rechteck definiert wird, in dem gesucht wird; oder
      • Parameter location und radius: Sie können Ergebnisse innerhalb eines bestimmten Kreises bevorzugen, indem Sie die Parameter location und radius übergeben. Dies weist den Places-Dienst für Orte an, vorzugsweise Ergebnisse innerhalb dieses Kreises anzuzeigen. Ergebnisse außerhalb dieses Bereichs können aber weiterhin angezeigt werden. Der Parameter „location“ verwendet ein Objekt google.maps.LatLng, und der Radius verwendet eine einfache Ganzzahl, die den Kreisradius in Metern angibt. Der maximal zulässige Radius beträgt 50.000 Meter.
    • type — schränkt die Ergebnisse auf Orte ein, die mit dem angegebenen Typ übereinstimmen. Es kann nur ein Typ angegeben werden. (Bei Angabe mehrerer Typen werden alle Typen hinter dem ersten Eintrag ignoriert.) Weitere Informationen finden Sie in der Liste der unterstützten Typen.
    • types (verworfen) – ein Array, das einen oder mehrere unterstützte Typen enthält. Der Dienst gibt Ergebnisse zurück, die einem beliebigen der angegebenen Typen entsprechen.

Übergeben Sie außerdem eine Callbackmethode an textSearch(), um das Ergebnisobjekt und die Antwort von google.maps.places.PlacesServiceStatus verarbeiten zu können.

var map;
var service;
var infowindow;

function initialize() {
  var pyrmont = new google.maps.LatLng(-33.8665433,151.1956316);

  map = new google.maps.Map(document.getElementById('map'), {
      center: pyrmont,
      zoom: 15
    });

  var request = {
    location: pyrmont,
    radius: '500',
    query: 'restaurant'
  };

  service = new google.maps.places.PlacesService(map);
  service.textSearch(request, callback);
}

function callback(results, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      var place = results[i];
      createMarker(results[i]);
    }
  }
}

Radar Search-Anforderungen

Mit einer Radar Search-Anforderung können Sie nach Orten innerhalb eines bestimmten Radius nach Stichwort oder Typ suchen. Eine Radar Search-Abfrage gibt mehr Ergebnisse zurück als Nearby Search oder Text Search, die Ergebnisse enthalten jedoch weniger Felder. Sie können PlacesService.getDetails() aufrufen, um mehr Informationen zu den zurückgegebenen Orten zu erhalten.

Die von radarSearch() zurückgegebenen Objekte PlaceResult enthalten lediglich folgende Eigenschaften:

  • geometry.location
  • place_id
  • reference (Hinweis: reference ist gegenüber place_id veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite.)

Eine Places Radar Search-Anforderung wird gestartet, indem Sie die Methode radarSearch() von PlacesService, aufrufen. Das Ergebnis des Aufrufs ist ein Array mit bis zu 200 Objekten vom Typ PlaceResult.

service = new google.maps.places.PlacesService(map);
service.radarSearch(request, callback);

Diese Methode verwendet eine Anforderung mit folgenden Feldern:

  • Entweder:
    • bounds; dies muss ein Objekt google.maps.LatLngBounds sein, mit dem der rechteckige Suchbereich definiert wird; oder
    • ein Feld location und ein Feld radius; das erste Feld verwendet ein Objekt google.maps.LatLng, und das zweite verwendet eine einfache Ganzzahl, die den Kreisradius in Metern angibt. Der maximal zulässige Radius beträgt 50.000 Meter.
  • Mindestens eine der folgenden Felder:
    • keyword (optional) — ein Begriff der mit allen verfügbaren Feldern abzugleichen ist, einschließlich, aber nicht ausschließlich Name, Typ und Adresse sowie Kundenbewertungen oder andere Inhalte von Dritten.
    • name (optional) — ein Begriff, der mit allen Ortsnamen abzugleichen ist. Die Ergebnisse werden auf die Einträge beschränkt, die den übergebenen Namenswert enthalten. Beachten Sie, dass mit einem Ort zusätzlich zum aufgeführten Namen noch weitere Namen verbunden sein können. Von der API wird versucht, den übergebenen Wert name mit all diesen Namen abzugleichen; dies kann die Rückgabe von Ergebnissen zur Folge haben, deren aufgeführte Namen nicht mit dem Suchbegriff übereinstimmen, jedoch ihre zugehörigen Namen.
    • type — schränkt die Ergebnisse auf Orte ein, die mit dem angegebenen Typ übereinstimmen. Es kann nur ein Typ angegeben werden. (Bei Angabe mehrerer Typen werden alle Typen hinter dem ersten Eintrag ignoriert.) Weitere Informationen finden Sie in der Liste der unterstützten Typen.
    • types (verworfen) – ein Array mit einem oder mehreren unterstützten Typen. Der Dienst gibt das bestmögliche Ergebnis für einen vorgegebenen Satz von Typen zurück.
  • Optional:
    • minPriceLevel und maxPriceLevel (optional) — beschränkt die Ergebnisse auf Orte innerhalb der angegebenen Preisstufe. Werte von 0 (am preisgünstigsten) bis einschließlich 4 (am teuersten) sind zulässig.
    • openNow — ein Boolescher Wert, der angibt, dass der Places-Dienst nur die Orte zurückgeben soll, für die der Sendezeitpunkt der Abfrage innerhalb ihrer Öffnungszeiten liegt. Wenn Sie diesen Parameter in Ihre Abfrage einbinden, werden Orte, die keine Öffnungszeiten in der Google Places-Datenbank hinterlegt haben, nicht zurückgegeben. Wenn Sie openNow auf false setzen, hat dies keine Auswirkungen.

Übergeben Sie außerdem eine Callbackmethode an radarSearch(), um das Objekt PlaceResults und google.maps.places.PlacesServiceStatus verarbeiten zu können.

// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;
var infoWindow;
var service;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -33.867, lng: 151.206},
    zoom: 15,
    styles: [{
      stylers: [{ visibility: 'simplified' }]
    }, {
      elementType: 'labels',
      stylers: [{ visibility: 'off' }]
    }]
  });

  infoWindow = new google.maps.InfoWindow();
  service = new google.maps.places.PlacesService(map);

  // The idle event is a debounced event, so we can query & listen without
  // throwing too many requests at the server.
  map.addListener('idle', performSearch);
}

function performSearch() {
  var request = {
    bounds: map.getBounds(),
    keyword: 'best view'
  };
  service.radarSearch(request, callback);
}

function callback(results, status) {
  if (status !== google.maps.places.PlacesServiceStatus.OK) {
    console.error(status);
    return;
  }
  for (var i = 0, result; result = results[i]; i++) {
    addMarker(result);
  }
}

function addMarker(place) {
  var marker = new google.maps.Marker({
    map: map,
    position: place.geometry.location,
    icon: {
      url: 'https://developers.google.com/maps/documentation/javascript/images/circle.png',
      anchor: new google.maps.Point(10, 10),
      scaledSize: new google.maps.Size(10, 17)
    }
  });

  google.maps.event.addListener(marker, 'click', function() {
    service.getDetails(place, function(result, status) {
      if (status !== google.maps.places.PlacesServiceStatus.OK) {
        console.error(status);
        return;
      }
      infoWindow.setContent(result.name);
      infoWindow.open(map, marker);
    });
  });
}
<div id="map"></div>
/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}
<!-- Replace the value of the key parameter with your own API key. -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap&libraries=places,visualization" async defer></script>
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;
var infoWindow;
var service;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -33.867, lng: 151.206},
    zoom: 15,
    styles: [{
      stylers: [{ visibility: 'simplified' }]
    }, {
      elementType: 'labels',
      stylers: [{ visibility: 'off' }]
    }]
  });

  infoWindow = new google.maps.InfoWindow();
  service = new google.maps.places.PlacesService(map);

  // The idle event is a debounced event, so we can query & listen without
  // throwing too many requests at the server.
  map.addListener('idle', performSearch);
}

function performSearch() {
  var request = {
    bounds: map.getBounds(),
    keyword: 'best view'
  };
  service.radarSearch(request, callback);
}

function callback(results, status) {
  if (status !== google.maps.places.PlacesServiceStatus.OK) {
    console.error(status);
    return;
  }
  for (var i = 0, result; result = results[i]; i++) {
    addMarker(result);
  }
}

function addMarker(place) {
  var marker = new google.maps.Marker({
    map: map,
    position: place.geometry.location,
    icon: {
      url: 'https://developers.google.com/maps/documentation/javascript/images/circle.png',
      anchor: new google.maps.Point(10, 10),
      scaledSize: new google.maps.Size(10, 17)
    }
  });

  google.maps.event.addListener(marker, 'click', function() {
    service.getDetails(place, function(result, status) {
      if (status !== google.maps.places.PlacesServiceStatus.OK) {
        console.error(status);
        return;
      }
      infoWindow.setContent(result.name);
      infoWindow.open(map, marker);
    });
  });
}

Beispiel anzeigen (place-radar-search.html).

Suchergebnisse

Statuscodes

Das Antwortobjekt PlacesServiceStatus enthält den Status der Anforderung und kann auch Debuginformationen enthalten, die Ihnen helfen sollen herauszufinden, warum die Ortsanforderung nicht erfolgreich war. Mögliche Statuswerte sind:

  • ERROR: Bei der Verbindungsherstellung zu den Google-Servern ist ein Problem aufgetreten.
  • INVALID_REQUEST: Die Anforderung war unzulässig.
  • OK: Die Antwort enthält ein gültiges Ergebnis.
  • OVER_QUERY_LIMIT: Das Anforderungskontingent für die Webseite wurde überschritten.
  • REQUEST_DENIED: Die Webseite ist nicht berechtigt, PlacesService zu nutzen.
  • UNKNOWN_ERROR: Die Anforderung von PlacesService konnte aufgrund eines Serverfehlers nicht verarbeitet werden. Möglicherweise ist die Anforderung beim nächsten Versuch erfolgreich.
  • ZERO_RESULTS: Für diese Anforderung wurde kein Ergebnis gefunden.

Place Search-Ergebnisse

Die Funktionen nearbySearch() und textSearch() geben einen Array mit Objekten vom Typ PlaceResult zurück. Die Funktion radarSearch() gibt einen Subset der Felder in PlaceResult zurück, wie oben erläutert.

Jedes Objekt PlaceResult kann folgende Eigenschaften enthalten:

  • formatted_address ist eine Zeichenfolge mit der Adresse dieses Orts in lesbarer Form. Diese Adresse stimmt häufig mit der „Postanschrift“ überein. Diese Eigenschaft formatted_address wird nur bei einer Text Search-Anforderung zurückgegeben.
  • geometry: Die geometrischen Daten eines Ortes. Dazu gehören:
    • location gibt den Breiten- und Längengrad des Orts an.
    • viewport definiert den bevorzugten Viewport auf der Karte für die Anzeige dieses Orts.
  • html_attributions: Ein Array mit Zuordnungen, die Sie beim Anzeigen der Suchergebnisse anzeigen sollten. Jeder Eintrag im Array enthält den HTML-Text für eine einzelne Zuordnung. Hinweis: Dies ist eine Verdichtung aller Zuordnungen der gesamten Suchantwort. Alle Objekte PlaceResult der Antwort enthalten daher identische Zuordnungslisten.
  • icon: URL einer Bildressource, die zur Darstellung des Ortstypen verwendet werden kann.
  • id: Enthält eine eindeutige ID zur Bezeichnung dieses Orts. Die ID kann nicht zum Anfordern von Informationen zu diesem Ort verwendet werden, aber sie kann zum Konsolidieren von Daten zu diesem Ort und zur Überprüfung der Identität eines Orts aus mehreren Suchvorgängen dienen. Da sich IDs gelegentlich ändern können, wird empfohlen, die gespeicherte ID für einen Ort mit der ID, die später in Anforderungen für Ortsdaten für denselben Ort zurückgegeben wird, zu vergleichen und ggf. zu aktualisieren. Hinweis: id ist gegenüber place_id veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite.
  • name: Der Name des Orts.
  • opening_hours kann die folgenden Informationen enthalten:
    • open_now ist ein Boolescher Wert, der angibt, ob ein Ort aktuell geöffnet ist.
  • place_id ist eine ID in Textform, die einen Ort eindeutig bezeichnet. Um Informationen zu einem Ort abzurufen, geben Sie diese ID in das Feld placeId einer Anforderung von Ortsdaten ein. Weitere Informationen finden Sie unter Erstellen von Verweisen auf Orte mit einer Orts-ID.
  • rating: Enthält die Bewertung des Orts. Sie liegt, basierend auf den aggregierten Benutzerbewertungen, zwischen 0,0 und 5,0.
  • reference enthält ein Token, das Sie zukünftig zum Abfragen des Ortsdatendiensts verwenden können. Dieses Token kann von der in der Abfrage des Ortsdatendiensts verwendeten Referenz abweichen. Gespeicherte Referenzen für Orte sollten regelmäßig aktualisiert werden. Auch wenn dieses Token den Ort eindeutig identifiziert, gilt das umgekehrt nicht: Ein Ort kann viele gültige Referenztokens haben. Hinweis: reference ist gegenüber place_id veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite.
  • types – ein Array mit Typen für diesen Ort (z. B. ["political", "locality"] oder ["restaurant", "lodging"]).
  • vicinity: Eine vereinfachte Adresse für den Ort, einschließlich Straße, Hausnummer und Verwaltungseinheit, aber ohne Provinz/Bundesland, Postleitzahl oder Land. Beispiel: Der Google-Firmensitz in Sydney, Australien, hat für vicinity den Wert 5/48 Pirrama Road, Pyrmont.

Weitere Ergebnisse aufrufen

Standardmäßig werden für jeden Ort pro Abfrage bis zu 20 Ergebnisse zurückgegeben. Für jede Suche können jedoch bis zu 60 Ergebnisse über drei Seiten zurückgegeben werden. Weitere Seiten sind über das Objekt PlaceSearchPagination verfügbar. Um weitere Seiten aufzurufen, müssen Sie das Objekt PlaceSearchPagination über eine Callbackfunktion erfassen. Das Objekt PlaceSearchPagination ist wie folgt definiert:

  • hasNextPage: Eine Boolesche Eigenschaft, mit der angegeben wird, ob weitere Ergebnisse verfügbar sind. Der Wert true besagt, dass eine weitere Ergebnisseite vorhanden ist.
  • nextPage(): Eine Funktion, mit der die nächste Ergebnisgruppe zurückgegeben wird. Nach dem Ausführen einer Suche müssen Sie zwei Sekunden warten, bevor die nächste Ergebnisseite verfügbar ist.

Um die nächste Ergebnisgruppe anzuzeigen, rufen Sie nextPage auf. Jede einzelne Ergebnisseite muss angezeigt werden, bevor die nächste Ergebnisseite angezeigt werden kann. Beachten Sie, dass jede Suche hinsichtlich Ihrer Nutzungsbeschränkungen wie eine einzelne Anforderung gezählt wird.

Im nachfolgenden Beispiel wird gezeigt, wie Sie Ihre Callbackfunktion ändern, um das Objekt PlaceSearchPagination zu erfassen, damit Sie mehrere Suchanforderungen stellen können.

// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;

function initMap() {
  var pyrmont = {lat: -33.866, lng: 151.196};

  map = new google.maps.Map(document.getElementById('map'), {
    center: pyrmont,
    zoom: 17
  });

  var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({
    location: pyrmont,
    radius: 500,
    type: ['store']
  }, processResults);
}

function processResults(results, status, pagination) {
  if (status !== google.maps.places.PlacesServiceStatus.OK) {
    return;
  } else {
    createMarkers(results);

    if (pagination.hasNextPage) {
      var moreButton = document.getElementById('more');

      moreButton.disabled = false;

      moreButton.addEventListener('click', function() {
        moreButton.disabled = true;
        pagination.nextPage();
      });
    }
  }
}

function createMarkers(places) {
  var bounds = new google.maps.LatLngBounds();
  var placesList = document.getElementById('places');

  for (var i = 0, place; place = places[i]; i++) {
    var image = {
      url: place.icon,
      size: new google.maps.Size(71, 71),
      origin: new google.maps.Point(0, 0),
      anchor: new google.maps.Point(17, 34),
      scaledSize: new google.maps.Size(25, 25)
    };

    var marker = new google.maps.Marker({
      map: map,
      icon: image,
      title: place.name,
      position: place.geometry.location
    });

    placesList.innerHTML += '<li>' + place.name + '</li>';

    bounds.extend(place.geometry.location);
  }
  map.fitBounds(bounds);
}
<div id="map"></div>
<div id="right-panel">
  <h2>Results</h2>
  <ul id="places"></ul>
  <button id="more">More results</button>
</div>
/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#right-panel {
  font-family: 'Roboto','sans-serif';
  line-height: 30px;
  padding-left: 10px;
}

#right-panel select, #right-panel input {
  font-size: 15px;
}

#right-panel select {
  width: 100%;
}

#right-panel i {
  font-size: 12px;
}
#right-panel {
  font-family: Arial, Helvetica, sans-serif;
  position: absolute;
  right: 5px;
  top: 60%;
  margin-top: -195px;
  height: 330px;
  width: 200px;
  padding: 5px;
  z-index: 5;
  border: 1px solid #999;
  background: #fff;
}
h2 {
  font-size: 22px;
  margin: 0 0 5px 0;
}
ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
  height: 271px;
  width: 200px;
  overflow-y: scroll;
}
li {
  background-color: #f1f1f1;
  padding: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
li:nth-child(odd) {
  background-color: #fcfcfc;
}
#more {
  width: 100%;
  margin: 5px 0 0 0;
}
<!-- Replace the value of the key parameter with your own API key. -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&libraries=places&callback=initMap" async defer></script>
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var map;

function initMap() {
  var pyrmont = {lat: -33.866, lng: 151.196};

  map = new google.maps.Map(document.getElementById('map'), {
    center: pyrmont,
    zoom: 17
  });

  var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({
    location: pyrmont,
    radius: 500,
    type: ['store']
  }, processResults);
}

function processResults(results, status, pagination) {
  if (status !== google.maps.places.PlacesServiceStatus.OK) {
    return;
  } else {
    createMarkers(results);

    if (pagination.hasNextPage) {
      var moreButton = document.getElementById('more');

      moreButton.disabled = false;

      moreButton.addEventListener('click', function() {
        moreButton.disabled = true;
        pagination.nextPage();
      });
    }
  }
}

function createMarkers(places) {
  var bounds = new google.maps.LatLngBounds();
  var placesList = document.getElementById('places');

  for (var i = 0, place; place = places[i]; i++) {
    var image = {
      url: place.icon,
      size: new google.maps.Size(71, 71),
      origin: new google.maps.Point(0, 0),
      anchor: new google.maps.Point(17, 34),
      scaledSize: new google.maps.Size(25, 25)
    };

    var marker = new google.maps.Marker({
      map: map,
      icon: image,
      title: place.name,
      position: place.geometry.location
    });

    placesList.innerHTML += '<li>' + place.name + '</li>';

    bounds.extend(place.geometry.location);
  }
  map.fitBounds(bounds);
}

Beispiel anzeigen (place-search-pagination.html).

Ortsdaten

Zusätzlich zur Anzeige einer Liste von Orten innerhalb eines Bereichs kann der Places-Dienst auch detaillierte Informationen zu einem bestimmten Ort zurückgeben. Sobald ein Ort in einer Ortssuchanforderung zurückgegeben wurde, kann seine place ID dazu verwendet werden, weitere Daten zu diesem Ort anzufordern, z. B. die vollständige Adresse, Telefonnummer, Benutzerbewertung und -kritiken usw. (Die Ortsreferenz (reference) kann ebenfalls zum Abrufen von Ortsdaten verwendet werden; dieses Feld ist jedoch gegenüber „place ID“ veraltet. Siehe hierzu den Hinweis zur Veralterung auf dieser Seite.)

Ortsdatenanforderungen

Place Details werden durch Aufrufen der Dienstmethode getDetails() angefordert.

service = new google.maps.places.PlacesService(map);
service.getDetails(request, callback);

Die Methode verwendet einen Anforderung, in der placeId oder reference des gewünschten Ortes enthalten ist. reference ist gegenüber placeId veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite. Weitere Informationen finden Sie unter Erstellen von Verweisen auf Orte mit einer Orts-ID.

Außerdem wird eine Callbackmethode verwendet, mit der der in der Antwort google.maps.places.PlacesServiceStatus übergebene Statuscode verarbeitet wird, sowie das Objekt google.maps.places.PlaceResult.

var request = {
  placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4'
};

service = new google.maps.places.PlacesService(map);
service.getDetails(request, callback);

function callback(place, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    createMarker(place);
  }
}

Beispiel anzeigen (place-details.html)

Ortsdatenantworten

Statuscodes

Das Antwortobjekt PlacesServiceStatus enthält den Status der Anforderung und kann auch Debuginformationen enthalten, die Ihnen helfen sollen herauszufinden, warum die Place Details-Anforderung nicht erfolgreich war. Mögliche Statuswerte sind:

  • ERROR: Bei der Verbindungsherstellung zu den Google-Servern ist ein Problem aufgetreten.
  • INVALID_REQUEST: Die Anforderung war unzulässig.
  • OK: Die Antwort enthält ein gültiges Ergebnis.
  • OVER_QUERY_LIMIT: Das Anforderungskontingent für die Webseite wurde überschritten.
  • NOT_FOUND: Der referenzierte Ort wurde in der Places-Datenbank nicht gefunden.
  • REQUEST_DENIED: Die Webseite ist nicht berechtigt, PlacesService zu nutzen.
  • UNKNOWN_ERROR: Die Anforderung von PlacesService konnte aufgrund eines Serverfehlers nicht verarbeitet werden. Möglicherweise ist die Anforderung beim nächsten Versuch erfolgreich.
  • ZERO_RESULTS: Für diese Anforderung wurde kein Ergebnis gefunden.

Ortsdatenergebnisse

Bei einem erfolgreichen Aufruf von getDetails() wird ein Objekt PlaceResult mit folgenden Eigenschaften zurückgegeben:

  • address_components: Eine Auflistung der Adressbestandteile für den Standort dieses Ortes. Weitere Informationen finden Sie im Abschnitt Typen von Adressen und Adresskomponenten des Geocoding-Dienstes.
  • formatted_address: Die vollständige Adresse des Ortes.
  • formatted_phone_number: Die Telefonnummer des Orts, formatiert gemäß den regionalen Nummernkonventionen.
  • geometry: Die geometrischen Daten eines Ortes. Dazu gehören:
    • location gibt den Breiten- und Längengrad des Orts an.
    • viewport definiert den bevorzugten Viewport auf der Karte für die Anzeige dieses Orts.
  • html_attributions: Enthält den für diesen Ort anzuzeigenden Zuordnungstext.
  • icon: URL einer Bildressource, die zur Darstellung des Ortstypen verwendet werden kann.
  • id: Enthält eine eindeutige ID zur Bezeichnung dieses Orts. Die ID kann nicht zum Anfordern von Informationen zu diesem Ort verwendet werden, aber sie kann zum Konsolidieren von Daten zu diesem Ort und zur Überprüfung der Identität eines Orts aus mehreren Suchvorgängen dienen. Da sich IDs gelegentlich ändern können, wird empfohlen, die gespeicherte ID für einen Ort mit der ID, die später in Anforderungen für Ortsdaten für denselben Ort zurückgegeben wird, zu vergleichen und ggf. zu aktualisieren. Hinweis: id ist gegenüber place_id veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite.
  • international_phone_number enthält die Telefonnummer des Orts im internationalen Format. Das internationale Format umfasst die Ländervorwahl mit einem vorangestellten Pluszeichen (+). Beispiel: Die international_phone_number für den Google-Firmensitz in Sydney, Australien, ist +61 2 9374 4000.
  • name: Der Name des Orts.
  • utc_offset enthält die Anzahl der Minuten, um die die aktuelle Zeitzone dieses Orts von der UTC-Zeit abweicht. Beispiel: Für Orte in Sydney, Australien, beträgt diese Zeitverschiebung während der Sommerzeit 660 (+11 Stunden gegenüber UTC) und für Orte in Kalifornien, USA, in der Winterzeit -480 (-8 Stunden gegenüber UTC).
  • opening_hours enthält die folgenden Informationen:
    • open_now ist ein Boolescher Wert, der angibt, ob ein Ort aktuell geöffnet ist.
    • periods[] ist ein chronologisch geordneter Array der Öffnungszeiten über sieben Tage, beginnend mit Sonntag. Jeder Zeitraum enthält die folgenden Werte:
      • open enthält ein Paar von Datum- und Uhrzeitobjekten, die besagen, wann der Ort öffnet:
        • day ist eine Zahl von 0 bis 6, entsprechend den Wochentagen, beginnend mit Sonntag. Beispiel: 2 bedeutet Dienstag.
        • time: Kann eine Uhrzeit im 24-Stunden-Format (hhmm) enthalten (die Werte reichen von 0000 bis 2359). time wird in der Zeitzone des Orts gemeldet.
      • close kann ein Paar von Datum- und Uhrzeitobjekten enthalten, die besagen, wann der Ort schließt. Hinweis: Wenn ein Ort immer geöffnet ist, bleibt close in der Antwort leer. In der Anwendung kann vorausgesetzt werden, dass „always-open“ als der Zeitraum open mit day gleich 0 und time gleich 0000 angezeigt wird. close wird überhaupt nicht gemeldet.
    • weekday_text ist ein Array von sieben Zeichenfolgen, die für die formatierten Öffnungszeiten an den einzelnen Wochentagen stehen. Wurde der Parameter language in der Ortsdatenanforderung angegeben, formatiert und übersetzt der Ortsdienst die Öffnungszeiten für die jeweilige Sprache. Die Reihenfolge der Elemente im Array hängt vom Parameter language ab. In einigen Sprachen beginnt die Woche mit dem Montag, in anderen mit dem Sonntag.
  • permanently_closed: ein Boolesches Flag, das angibt, ob der Ort dauerhaft geschlossen ist (Wert true). Ist der Ort nicht dauerhaft geschlossen, fehlt das Flag in der Antwort.
  • photos[]: Ein Array mit Objekten vom Typ PlacePhoto. Mit einem Objekt PlacePhoto können Sie ein Foto mithilfe der Methode getUrl() beschaffen oder das Objekt auf folgende Werte prüfen:
    • height: Die maximale Höhe des Fotos in Pixeln.
    • width: Die maximale Breite des Fotos in Pixeln.
    • html_attributions: Enthält den zu diesem Ort anzuzeigenden Zuordnungstext.
  • place_id: Eine ID in Textform, über die ein Ort eindeutig bezeichnet wird und die zum Abrufen von Informationen über den Ort mithilfe einer Place Details-Anforderung verwendet werden kann. Weitere Informationen finden Sie unter Erstellen von Verweisen auf Orte mit einer Orts-ID.
  • rating: Die Bewertung des Orts. Sie liegt, basierend auf den aggregierten Benutzerbewertungen, zwischen 0,0 und 5,0.
  • reference enthält ein Token, das Sie zukünftig zum Abfragen des Ortsdatendiensts verwenden können. Dieses Token kann von der in der Abfrage des Ortsdatendiensts verwendeten Referenz abweichen. Gespeicherte Referenzen für Orte sollten regelmäßig aktualisiert werden. Auch wenn dieses Token den Ort eindeutig identifiziert, gilt das umgekehrt nicht: Ein Ort kann viele gültige Referenztokens haben. Hinweis: reference ist gegenüber place_id veraltet; siehe hierzu den Hinweis zur Veralterung auf dieser Seite.
  • reviews: Ein Array von bis zu fünf Kritiken. Jede Kritik besteht aus mehreren Komponenten:
    • aspects[]: Enthält eine Sammlung von Objekten des Typs PlaceAspectRating, die jedes für sich eine Bewertung eines einzelnen Attributs der Einrichtung liefern. Das erste Objekt im Array gilt als der primäre Aspekt. Jedes Objekt des Typs PlaceAspectRating wird wie folgt beschrieben:
      • type ist der Name des bewerteten Aspekts. Folgende Typen werden unterstützt: appeal, atmosphere, decor, facilities, food, overall, quality und service.
      • rating ist die Bewertung dieses Aspekts durch den Benutzer; sie reicht von 0 bis 3.
    • author_name ist der Name des Benutzers, der die Kritik abgegeben hat. Anonyme Kritiken werden „einem Google-Benutzer“ zugeschrieben. Wenn ein Sprachparameter gesetzt wurde, gibt die Phrase „ein Google-Benutzer“ eine lokalisierte Zeichenfolge zurück.
    • author_url ist die URL zum Google+-Profil des Benutzers, falls ein solches Profil vorhanden sein sollte.
    • language ist ein IETF-Sprachcode, der die in der Benutzerkritik verwendete Sprache angibt. Dieses Feld enthält nur das primäre Tag für die Sprache, nicht das sekundäre Tag für Land oder Region. Beispiel: Alle englischsprachigen Kritiken erhalten das Tag „en“ und nicht „en-AU“ oder „en-UK“ usw.
    • rating ist die Gesamtbewertung dieses Orts durch den Benutzer. Der Wert wird als Ganzzahl zwischen 1 und 5 angegeben.
    • text ist die Kritik des Benutzers. Wenn Sie eine Kritik für einen Ort in Google Places erstellen, gelten diese Kritiken in Textform als optional; daher kann dieses Feld manchmal leer sein.
  • types – ein Array mit Typen für diesen Ort (z. B. ["political", "locality"] oder ["restaurant", "lodging"]).
  • url: Die URL der offiziellen Google-Seite für diesen Ort. Es handelt sich dabei um die die Google-eigene Seite, die die bestmöglichen Informationen zum Ort enthält. Anwendungen müssen einen Link zu dieser Seite setzen oder sie einbetten, und zwar auf jedem Bildschirm, der dem Benutzer detaillierte Ergebnisse zu diesem Ort anzeigt.
  • vicinity: Eine vereinfachte Adresse für den Ort, einschließlich Straße, Hausnummer und Verwaltungseinheit, aber ohne Provinz/Bundesland, Postleitzahl oder Land. Beispiel: Der Google-Firmensitz in Sydney, Australien, hat für vicinity den Wert 5/48 Pirrama Road, Pyrmont. Die Eigenschaft vicinity wird nur bei einer Nearby Search zurückgegeben.
  • website listet die autoritative Website für diesen Ort auf, wie beispielsweise die Homepage des Unternehmens.

Mehrdimensionale Bewertungen sind möglicherweise nicht für alle Orte verfügbar. Falls zu wenig Kritiken vorhanden sind, enthält die Antwort auf eine Ortsdatenanforderung entweder eine Vorgängerbewertung auf einer Skala von 0,0 bis 5,0 (falls verfügbar) oder gar keine Bewertung.

Verweise auf Orte mit einer Orts-ID erstellen

Es besteht die Möglichkeiten, auf Orte auf einer Google-Karte anhand ihrer Orts-ID zu verweisen. Orts-IDs können für die meisten Orte abgerufen werden, einschließlich Unternehmen, Sehenswürdigkeiten, Parks und Knotenpunkte. Diese IDs sind stabil, das heißt, sobald Sie die Orts-ID eines Standorts identifiziert haben, können Sie diesen Wert bei der nächsten Suche nach demselben Standort wiederverwenden.

Wenn Sie eine Orts-ID in Ihrer App verwenden möchten, müssen Sie zunächst nach der ID suchen, die in PlaceResult als Ergebnis einer Places Search- oder Places Details-Anforderung verfügbar ist. Danach können Sie die Orts-ID verwenden, um nach Place Details zu suchen oder um das Zuordnungsspeichern in einer anmeldungsspezifischen Karte zu aktivieren.

Orts-IDs sind, mit Ausnahme der Zwischenspeicherbeschränkungen, in Abschnitt 10.5.d der Google Maps API-Nutzungsbedingungen angegeben. Daher können Sie Orts-ID-Werte unbegrenzt speichern.

var map;

function initialize() {
  // Create a map centered in Pyrmont, Sydney (Australia).
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -33.8666, lng: 151.1958},
    zoom: 15
  });

  // Search for Google's office in Australia.
  var request = {
    location: map.getCenter(),
    radius: '500',
    query: 'Google Sydney'
  };

  var service = new google.maps.places.PlacesService(map);
  service.textSearch(request, callback);
}

// Checks that the PlacesServiceStatus is OK, and adds a marker
// using the place ID and location from the PlacesService.
function callback(results, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    var marker = new google.maps.Marker({
      map: map,
      place: {
        placeId: results[0].place_id,
        location: results[0].geometry.location
      }
    });
  }
}

google.maps.event.addDomListener(window, 'load', initialize);

Place Photos

Mit der Place Photos-Funktion können Sie hochwertige fotografische Inhalte zu Ihrer Website hinzufügen. Mit dem Photo-Dienst können Sie auf Millionen von ortsbezogenen Fotos in der Places-Datenbank von Google und in der lokalen Google+-Datenbank zugreifen. Wenn Sie Ortsdaten mithilfe einer Place Details-Anforderung abrufen, erhalten Sie Fotoreferenzen zu relevanten fotografischen Inhalten zurück. Nearby Search- und Text Search-Anforderung geben auch, falls relevant, eine einzige Fotoreferenz pro Ort zurück. Mit dem Fotodienst können Sie auf das referenzierte Foto zugreifen und das Bild auf die für Ihre Anwendung optimale Größe skalieren.

Bei jeder Anforderung getDetails(), textSearch() oder nearbySearch(), die für einen PlacesService gestellt wird, wird ein Array mit Objekten PlacePhoto als Teil des Objekts PlaceResult zurückgegeben.

Hinweis: Die Anzahl der zurückgegebenen Fotos schwankt je nach Anforderung.

  • Eine Nearby Search- oder eine Text Search-Anforderung gibt maximal ein Objekt PlacePhoto zurück.
  • Radar Search-Anforderungen geben keinerlei Fotoinformationen zurück.
  • Eine Detailsuche gibt bis zu zehn Objekte PlacePhoto zurück.

Sie können die URL des zugehörigen Bilds anfordern, indem Sie die Methode PlacePhoto.getUrl() aufrufen und ein zulässiges Objekt PhotoOptions übergeben. Mit dem Objekt PhotoOptions können Sie die gewünschte Höhe und Breite des Bilds angeben. Wenn Sie die Werte max_height und max_width angeben, wird das Bild durch den Fotodienst auf die kleinere der beiden Größen skaliert, wobei das ursprüngliche Seitenverhältnis beibehalten wird.

Im folgenden Codeausschnitt wird ein Ortsobjekt akzeptiert und ein Marker zur Karte hinzugefügt, sofern ein Foto vorhanden ist. Das Marker-Standardbild wird durch eine kleine Version des Fotos ersetzt.

function createPhotoMarker(place) {
  var photos = place.photos;
  if (!photos) {
    return;
  }

  var marker = new google.maps.Marker({
    map: map,
    position: place.geometry.location,
    title: place.name,
    icon: photos[0].getUrl({'maxWidth': 35, 'maxHeight': 35})
  });
}

Feedback geben zu...

Google Maps JavaScript API
Google Maps JavaScript API