„Place Details“

Plattform auswählen: Android iOS JavaScript Webdienst

Abruffelder

Wenn Sie bereits ein Place-Objekt oder eine Orts-ID haben, können Sie mit der Methode Place.fetchFields() Details zu diesem Ort abrufen. Geben Sie eine durch Kommas getrennte Liste der zurückzugebenden Ortsdatenfelder an. Geben Sie Feldnamen in der Camel-Case-Schreibweise an. Verwenden Sie das Place-Objekt, das zurückgegeben wird, um Daten für die angeforderten Felder zu erhalten.

Im folgenden Beispiel wird eine Orts-ID verwendet, um eine neue Place-Instanz zu erstellen. Danach wird Place.fetchFields() aufgerufen, um die Felder displayName und formattedAddress abzurufen. Die zurückgegebenen Daten werden in der Console protokolliert.

TypeScript

async function getPlaceDetails() {
    const { Place } =  await google.maps.importLibrary("places") as google.maps.PlacesLibrary;
    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
    // Use place ID to create a new Place instance.
    const place = new Place({
        id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg',
        requestedLanguage: 'en', // optional
    });

    // Call fetchFields, passing the desired data fields.
    await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });

    // Log the result
    console.log(place.displayName);
    console.log(place.formattedAddress);

    // Add an Advanced Marker
    const marker = new AdvancedMarkerElement({
        map,
        position: place.location,
        title: place.displayName,
    });
}

JavaScript

async function getPlaceDetails() {
  const { Place } = await google.maps.importLibrary("places");
  const { AdvancedMarkerElement } = await google.maps.importLibrary("marker");
  // Use place ID to create a new Place instance.
  const place = new Place({
    id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg",
    requestedLanguage: "en", // optional
  });

  // Call fetchFields, passing the desired data fields.
  await place.fetchFields({
    fields: ["displayName", "formattedAddress", "location"],
  });
  // Log the result
  console.log(place.displayName);
  console.log(place.formattedAddress);

  // Add an Advanced Marker
  const marker = new AdvancedMarkerElement({
    map,
    position: place.location,
    title: place.displayName,
  });
}
Beachten Sie, dass Map und Place vor dieser Funktion deklariert wurden:
const { Map } = await google.maps.importLibrary("maps");
const { Place } = await google.maps.importLibrary("places");
Vollständiges Beispiel ansehen

Komponente „Ortsübersicht“ verwenden

Die Komponente „Standortübersicht“ enthält detaillierte Informationen zu Millionen von Unternehmen, darunter Öffnungszeiten, Rezensionen mit Bewertungen und Fotos sowie Wegbeschreibungen und andere Aktionen in einer vorgefertigten Benutzeroberfläche in fünf Größen und Formaten. Sie ist Teil der erweiterten Komponentenbibliothek der Google Maps Platform. Diese Bibliothek umfasst eine Reihe von Webkomponenten, mit denen Entwickler schneller bessere Karten und Standortfunktionen erstellen können.

Mit dem Konfigurator für die Infoseite zu einem Ort können Sie einbettbaren Code für eine benutzerdefinierte Infoseite zu einem Ort erstellen und dann für die Verwendung mit gängigen Frameworks wie React und Angular oder ohne Framework exportieren.