Place Details (nuevo)

Selecciona la plataforma: Android iOS JavaScript Servicio web
Desarrolladores del Espacio Económico Europeo (EEE)

Recuperar campos

Si tienes un objeto Place o un ID de lugar existentes, usa el método Place.fetchFields() para obtener detalles sobre ese lugar. Proporciona una lista separada por comas de los campos de datos de lugar que se devolverán. Especifica los nombres de los campos con mayúsculas mediales. Usa el objeto Place devuelto para obtener datos de los campos solicitados.

En el siguiente ejemplo, se usa un ID de lugar para crear un Place nuevo; se llama a Place.fetchFields() para solicitar los campos displayName y formattedAddress, se agrega un marcador al mapa y se registran algunos datos en la consola.

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,
    });
}
index.ts

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,
    });
}
index.js
Ten en cuenta que Map y Place se declararon antes de esta función: 
const { Map } = await google.maps.importLibrary("maps");
const { Place } = await google.maps.importLibrary("places");
 Ver el ejemplo completo

Cómo usar el componente Place Overview

El componente Resumen del lugar muestra información detallada sobre millones de empresas, incluidos horarios de atención, calificaciones con estrellas y fotos, además de instrucciones sobre cómo llegar y otras acciones en una IU prediseñada en 5 tamaños y formatos. Forma parte de la biblioteca de componentes extendidos de Google Maps Platform, un conjunto de componentes web que ayuda a los desarrolladores a crear mejores mapas y funciones de ubicación más rápido.

Usa el configurador de Place Overview para crear código incorporable para un componente de Place Overview personalizado y, luego, expórtalo para usarlo con frameworks populares como React y Angular, o sin ningún framework.