Ortsdetails (neu)

Plattform auswählen: Android iOS JavaScript Webdienst
Entwickler im Europäischen Wirtschaftsraum (EWR)

Felder abrufen

Wenn Sie bereits ein Place-Objekt oder eine Orts-ID haben, verwenden Sie die Methode Place.fetchFields(), um Details zu diesem Ort abzurufen. Geben Sie eine durch Kommas getrennte Liste der Ortsdatenfelder an, die zurückgegeben werden sollen. 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. Der Karte wird eine Markierung hinzugefügt und einige 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,
    });
}
Map und Place wurden vor dieser Funktion deklariert:
const { Map } = await google.maps.importLibrary("maps");
const { Place } = await google.maps.importLibrary("places");
Vollständiges Beispiel ansehen

„Place Overview“-Komponente verwenden

In der Komponente „Ortsübersicht“ werden detaillierte Informationen zu Millionen von Unternehmen angezeigt, darunter Öffnungszeiten, Sternebewertungen und Fotos sowie Wegbeschreibungen und andere Aktionen in einer vorgefertigten Benutzeroberfläche in 5 Größen und Formaten. Sie ist Teil der erweiterten Komponentenbibliothek der Google Maps Platform, einer Reihe von Webkomponenten, mit denen Entwickler schneller bessere Karten und Standortfunktionen erstellen können.

Mit dem Konfigurator für die Ortsübersicht können Sie einbettbaren Code für eine benutzerdefinierte Ortsübersichtskomponente erstellen und dann exportieren, um ihn mit gängigen Frameworks wie React und Angular oder ohne Framework zu verwenden.