Neste documento, você vai aprender a usar a API Nearby Search (New) para criar uma API simples e econômica.
experiência de descoberta local.
Uma experiência de descoberta local mostra aos usuários os principais lugares de interesse próximos a um local especificado quando eles pesquisam um hotel ou uma propriedade. Muitas vezes, ele consiste em um mapa interativo com um painel adicional que contém um seletor de lugares e uma galeria de fotos. Você vai encontrar diferentes produtos e recursos da Plataforma Google Maps para melhorar a experiência com interatividade.
Casos de uso
Agora vamos entender quais elementos da integração de descoberta local geram valor para o usuário:
Descoberta: mostre aos usuários uma visão geral do que há em um único local exibindo lugares relevantes de vários tipos.
Interatividade: permite que os usuários selecionem um lugar e atualizem os dados dinamicamente
em relação a esse lugar.
Visualização: forneça avaliações e fotos de lugares
e o tempo e a distância de caminhada para que os usuários entendam rapidamente se ele atende às necessidades deles.
Arquitetura de referência
Descoberta local
Há muitas maneiras de criar uma experiência de descoberta local. A integração a seguir é um exemplo personalizado de uma experiência do usuário que usa APIs conhecidas da Plataforma Google Maps e alguns recursos novos e interessantes. Se você quer ter uma abordagem de modelo para a descoberta local, use os componentes da Web.
Aplicativo de amostra
Exemplo de tutorial
Na tabela abaixo, você encontra o exemplo de aplicativo dividido em etapas, além de uma descrição da implementação técnica com as APIs da Plataforma Google Maps.
1. Pesquisa de local com o preenchimento automático
- Carregue a API Maps JavaScript.
- Pesquise no Preenchimento automático de lugares ou escolha um local no mapa.
2. Mostrar pontos de interesse locais usando a API Nearby Search (nova)
- Classificação de popularidade (resultados mais relevantes) ou classificação de distância.
includedTypes
,excludedTypes
: se você tiver um hotel, poderá excluir o tipo "lodging" e incluir apenas os tipos adequados, por exemplo: "restaurant, cafe, park, tourit_attraction".- Use
includedPrimaryTypes
eexcludedPrimaryTypes
para ter ainda mais controle sobre os resultados. - `locationRestriction para evitar um número insuficiente de resultados ou lugares muito distantes. No caso de ZERO resultados, amplie o tamanho do círculo / retângulo antes de mostrar os resultados.
Exemplo de consulta ao reservar um hotel com campos de dados solicitados:
- Básico (
displayName
,types
,openingHours
,formattedAddress
) - Contato (
websiteUri
,nationalPhoneNumber
,internationalPhoneNumber
) - Preferida (
reviews
,priceLevel
,userRatingCount
)
{ "includedTypes": ["restaurant","cafe","park"], "excludedTypes": ["lodging","convenience_store"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
Exemplo de consulta ao pesquisar um imóvel com campos de dados solicitados:
- Básico (
displayName
,types
,openingHours
,formattedAddress
)
{ "includedTypes": ["school","transport","bus","convenience_store"], "excludedTypes": ["lodging"], "includedPrimaryTypes": ["restaurant","tourist_attraction","airport"], "excludedPrimaryTypes": ["lodging"], "maxResultCount": 20, "locationRestriction": { "circle": { "center": { "latitude": 37.7937, "longitude": -122.3965 }, "radius": 500.0 } } }
3. Adicionar interatividade com a API Dynamic Maps and Directions
- Atualize as etapas e trechos consultando a API Directions. * Use o tempo na próxima seção.
4. Mostrar informações detalhadas do lugar após a interação
Descrição:
displayName
,types
,rating
,userRatingCount
epriceLevel
.Tempo: vem da consulta anterior da API Directions.
Avaliações:
reviews[i].author
,reviews[i].rating
,reviews[i].text
.Imagens: durante a pré-lançamento irrestrita da API Nearby Search (nova), você vai precisar consultar os detalhes do lugar com
place.id
para receber photo_reference e, em seguida, consultar um de cada vez na sua experiência.
Contagem de consultas e custo associado
- API Maps JavaScript: um mapa no carregamento da experiência.
- API Places Autocomplete: 1 consulta para cada caractere digitado (se estiver usando o widget de preenchimento automático), pode ser personalizada.
- API Nearby Search (nova): uma consulta a cada 20 lugares exibidos. Faturamento diferente de acordo com os dados do lugar que fazem parte da resposta da consulta.
- API Directions: uma consulta para cada lugar selecionado pelo usuário.
- API Place Photo: 1 consulta para cada foto exibida.
Conclusão
Uma experiência de descoberta local é uma maneira eficaz de oferecer valor ao usuário. Essa implementação de demonstração tem muitos recursos que você provavelmente vai incluir ao criar essa experiência na Plataforma Google Maps com recursos especiais da API Nearby Search (New) .
Próximas etapas
Leitura adicional sugerida:
- Web Components na API Maps JavaScript
- Otimização do Place Autocomplete
- Outros Serviços do Places
- Deixe seu feedback abaixo.
Colaboradores
Autores principais:
Thomas Anglaret | Engenheiro de soluções da Plataforma Google Maps