Migrar para os novos detalhes do lugar

Desenvolvedores do Espaço Econômico Europeu (EEE)

A API Places pode retornar informações detalhadas sobre um local específico. Esta página explica as diferenças entre os detalhes de lugares usados na classe Place(nova) e PlacesService (legado) e fornece alguns snippets de código para comparação. A tabela a seguir lista algumas das principais diferenças no uso de detalhes de lugares entre a classe Place e PlacesService:

PlacesService (legado) Place (novo)
getDetails() fetchFields()
PlaceDetailsRequest FetchFieldsRequest
Os métodos exigem o uso de um callback para processar o objeto de resultados e google.maps.places.PlacesServiceStatus resposta. Usa Promises e funciona de forma assíncrona.
Os métodos exigem uma verificação de PlacesServiceStatus. Nenhuma verificação de status necessária, pode usar o tratamento de erros padrão. Saiba mais.
Os campos de dados de lugares são formatados usando snake case. Os campos de dados de lugares são formatados usando camel case.
Limitado a um conjunto fixo de tipos de lugares e campos de dados de lugares. Oferece uma seleção expandida de tipos de lugares e campos de dados de lugares atualizados regularmente.

Comparação de código

Esta seção compara dois trechos de código semelhantes para ilustrar as diferenças entre o serviço Places e a classe Place. Os snippets de código mostram o código necessário em cada API para fazer uma solicitação de detalhes de lugares e, em seguida, usam os dados de lugares resultantes para adicionar um marcador ao mapa.

Serviço Places (legado)

O snippet de código condensado a seguir mostra como fazer uma solicitação de detalhes de lugares usando PlacesService. A solicitação usa um callback e inclui uma verificação condicional obrigatória em PlacesServiceStatus. Os campos de dados de lugares necessários são especificados no corpo da solicitação.

function getPlaceDetails() {
  // Instantiate the Places Service.
  const service = new google.maps.places.PlacesService(map);

  // Make a request using the Place ID.
  const request = {
    placeId: "ChIJN1t_tDeuEmsRUsoyG83frY4",
    fields: ["name", "formatted_address", "place_id", "geometry"],
  };

  // Request place details.
  service.getDetails(request, (place, status) => {
    // Check whether PlacesServiceStatus is OK.
    if (
      status === google.maps.places.PlacesServiceStatus.OK &&
      place &&
      place.geometry &&
      place.geometry.location
    ) {

      // Log the result.
      console.log(place.name);
      console.log(place.formatted_address);

      // Add a marker for the place.
      const marker = new google.maps.Marker({
        map,
        position: place.geometry.location,
        title: place.name,
      });
    }
  });
}

Saiba mais

Classe Place (nova)

O snippet de código condensado a seguir mostra como fazer uma solicitação de detalhes de lugares usando a classe Place. A solicitação é assíncrona e não inclui uma verificação de status (o tratamento de erros padrão pode ser usado). Um ID de lugar é usado para criar uma nova instância Place, que é usada para fazer a solicitação (fetchFields()). Os campos de dados de lugares necessários não são transmitidos até que fetchFields() seja chamado, o que oferece maior flexibilidade. Como o método fetchFields() usa o operador await, ele só pode ser usado dentro de uma função async.

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

  // Call fetchFields, passing the needed 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 google.maps.marker.AdvancedMarkerElement({
    map,
    position: place.location,
    title: place.displayName,
  });
}

Saiba mais