Visão geral
A Plataforma Google Maps está disponível para Web (JS, TS), Android e iOS e oferece APIs de serviços da Web para coletar informações sobre lugares, rotas e distâncias. Os exemplos deste guia são específicos para uma plataforma, mas também disponibilizamos os links de documentação referentes à implementação em outras plataformas.
Geralmente, os comprovantes de transações são difíceis de entender porque usam abreviações como "ACMEHCORP" em vez de nomes de comerciantes, como "Acme Houseware". Isso pode aumentar as ligações para o suporte ao cliente e levar a contestações caras. As transações aprimoradas fazem esse processo ser mais simples e intuitivo, informando o nome completo e a categoria de negócios de um comerciante, uma foto da vitrine, o endereço e a localização em um mapa, dados de contato completos e muito mais. Isso ajuda a aumentar a satisfação do usuário e a transparência, além de diminuir as ligações de suporte, aumentar a NPS e fazer com que as pessoas passem mais tempo no app.
É por isso que recomendamos as transações aprimoradas como a combinação ideal de APIs da Plataforma Google Maps para oferecer ótimas experiências aos usuários. O guia de implementação e as dicas de personalização são abordados neste artigo. Nesse guia de implementação, vamos mostrar como associar um local a um comerciante específico e exibir informações detalhadas dele.
![Telas de amostra das transações aprimoradas](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/enriched-transactions/images/diagram.png?authuser=5&hl=pt)
Ativar APIs
Para implementar as transações aprimoradas, você precisa ativar as APIs abaixo no Console do Google Cloud. Use os hiperlinks abaixo para acessar o Console do Google Cloud e ativar cada API no projeto selecionado:
Para mais detalhes sobre a configuração, consulte Como começar a usar a Plataforma Google Maps.Seções do guia de implementação
Veja a seguir as implementações e personalizações que vamos abordar neste tópico.
- O ícone de marca de seleção é essencial na implementação.
- O ícone de estrela é opcional, mas recomendado para melhorar a solução.
Associar comerciantes à Plataforma Google Maps | Associe um comerciante no histórico de transações a um lugar na Plataforma Google Maps. | |
Exibir detalhes do comerciante | Mostre transações com muitos dados e informações úteis sobre o comerciante para que os usuários possam reconhecer rapidamente a operação. | |
Adicionar um mapa do local do comerciante | Adicione um mapa do local do comerciante. |
Associar comerciantes à Plataforma Google Maps
Este exemplo usa: API Places |
Veja no diagrama a seguir como seu aplicativo associa as transações do comerciante para retornar um resultado usando o Place Details de um banco de dados de comerciantes ou uma solicitação do Place Search:
![Matriz de fluxo de correspondência do comerciante](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/enriched-transactions/images/decision-matrix-diagram.png?authuser=5&hl=pt)
Conseguir IDs de lugar da Plataforma Google Maps
Você pode ter um banco de dados de comerciantes com informações básicas, como o nome e endereço da empresa. Para buscar as informações que a Plataforma Google Maps tem sobre esse lugar, incluindo os dados de contato e outras informações enviadas pelos usuários, você precisa do ID de lugar da Plataforma Google Maps de cada um dos comerciantes do seu banco de dados.
Se quiser saber o ID de lugar de uma empresa, faça uma solicitação para o endpoint /findplacefromtext na API Places e peça apenas o campo place_id
para cobrar a solicitação como uma chamada sem custo financeiro do tipo Find Place – somente ID. Se o comerciante tiver vários locais, use o nome dele
com a cidade ou a rua. A qualidade dos dados retornados pela
chamada varia. Portanto, valide se os resultados
correspondem exatamente ao comerciante que você está buscando.
Veja um exemplo de solicitação do ID de lugar do escritório do Google em Taipei usando o nome do comerciante e a cidade:
https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=google%20taipei&inputtype=textquery&fields=place_id&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a
Codifique o URL no parâmetro de entrada na solicitação de API.
Armazenar IDs de lugar
Se quiser armazenar informações da Plataforma Google Maps sobre o comerciante para solicitações futuras, armazene este ID de lugar indefinidamente no seu banco de dados como um atributo do registro da empresa. Você só precisa fazer a solicitação do Find Place uma vez por comerciante. Também é possível pesquisar o ID de lugar sempre que um usuário solicitar detalhes da transação.
Para ter as informações mais precisas sempre,
atualize os IDs de lugar
a cada 12 meses usando uma solicitação de Place Details
com o parâmetro place_id
.
Se os detalhes do lugar que aparecem não são relacionados ao comerciante em que a transação foi feita, permita que os usuários enviem feedback sobre a qualidade da correspondência.
Exibir detalhes do comerciante
Este exemplo usa: API Places | Também disponível: SDK do Places para Android | SDK do Places para iOS | Biblioteca Places, API Maps JavaScript |
Você pode compartilhar Place Details que os usuários precisam saber depois de visitar um dos seus locais. Com detalhes mais completos, como dados de contato, horário de funcionamento, classificações e fotos de usuários, seu app pode lembrar os usuários sobre as transações que eles completarem. Após fazer uma chamada à API Places para ver Place Details, você vai poder filtrar e renderizar a resposta em uma janela de informações, em uma barra lateral na Web ou de qualquer outra forma que preferir.
![Exemplo de tela de detalhes do comerciante](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/solutions/enriched-transactions/images/enriched-transactions.png?authuser=5&hl=pt)
Para pedir informações do Place Details, você vai precisar do ID de cada um dos seus locais. Consulte Acessar IDs de lugares para recuperar o ID do seu local.
A seguinte solicitação do Place Details retorna o endereço, as coordenadas, o site,
o número de telefone, a classificação e o horário de funcionamento em um resultado json
com o ID do local do escritório do Google no edifício
Taipei 101:
https://maps.googleapis.com/maps/api/place/details/json?placeid=ChIJraeA2rarQjQRyAqIxkx2vN8&fields=name%2Cformatted_address%2Cwebsite%2Cformatted_phone_number%2Cgeometry/location%2Cicon%2Copening_hours%2Crating&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a
Adicionar um mapa do local do comerciante
Este exemplo usa: API Geocoding | API Maps Static | Também disponível: Android | iOS |
Determinar o local do comerciante
A API Maps Static aceita um endereço ou coordenadas para posicionar um marcador. Se o registro do comerciante já tiver um endereço, você pode seguir para a próxima seção, mas recomendamos usar coordenadas, em vez de endereços, para garantir que o mapa seja preciso.
Se o banco de dados do comerciante tiver endereços, mas não coordenadas geográficas, e você ainda não tiver feito uma solicitação do Place Details, será possível usar a API Geocoding para converter endereços em coordenadas de latitude/longitude no lado do servidor, armazenar coordenadas no seu banco de dados e atualizar uma vez a cada 30 dias, pelo menos.
Veja um exemplo de como usar a API Geocoding para ver a latitude e longitude do ID de lugar do escritório do Google em Taipei:
https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJraeA2rarQjQRyAqIxkx2vN8&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a
Adicionar um marcador de local do comerciante a um mapa
Os usuários vão consultar o mapa para confirmar transações, em vez de pesquisar essas informações. Por isso, convém criar um mapa com interatividade limitada.
Para computadores e Web para dispositivos móveis, crie um URL da API Maps Static com um único marcador na latitude/longitude ou endereço do comerciante. Você pode usar a API Maps Static com uma chamada de serviço da Web, que criará uma versão de imagem de um mapa de acordo com os parâmetros que você especificar. Em dispositivos móveis, pule para a próxima seção, Como adicionar um mapa no seu app para dispositivos móveis.
A seguinte chamada mostra um roteiro, com tamanho de 640x480px, centralizado em um marcador no escritório do Google em Taipei, com nível de zoom padrão. Também especifica um marcador de local de entrega vermelho e um estilo de mapa baseado na nuvem:
https://maps.googleapis.com/maps/api/staticmap?size=640x480&markers=color:red%7C25.033976%2C121.5645389&map_id=b224095f76859890&key=YOUR_API_KEY&signature=BASE64_SIGNATURE&solution_channel=GMP_guides_enrichedtransactions_v1_a
Ela se divide nas seguintes seções:
URL da API | https://maps.googleapis.com/maps/api/staticmap? |
Tamanho da imagem | size=640x480 |
Marcadores de local do comerciante (usando codificação de URL) | markers=color:red%7C25.033976%2C121.5645389 |
Estilização de mapas baseada na nuvem | map_id=b224095f76859890 |
Chave de API | key=YOUR_API_KEY |
Assinatura digital (saiba como assinar digitalmente sua solicitação) | signature=BASE64_SIGNATURE |
Parâmetro do canal de solução (consulte a documentação do parâmetro) | solution_channel=GMP_guides_enrichedtransactions_v1_a |
O resultado é a imagem mostrada abaixo:
Também é possível usar um endereço como a localização do marcador:
https://maps.googleapis.com/maps/api/staticmap?size=640x480&markers=color:green%7CTaipei%20101%20Tower%2CNo.%207信義路五段信義區台北市%20Taiwan%20110&map_id=b224095f76859890&key=YOUR_API_KEY&signature=BASE64_SIGNATURE&solution_channel=GMP_guides_enrichedtransactions_v1_a
Para mais opções de parâmetro, consulte a documentação da API Maps Static.
Adicionar um mapa ao seu app para dispositivos móveis
Se você usa o SDK do Maps para Android ou o SDK do Maps para iOS, é possível inserir um marcador usando as coordenadas da informação em Place Details.
Os usuários vão consultar o mapa para confirmar transações, em vez de pesquisar essas informações. Por isso, escolha um mapa com interatividade limitada.
- Para apps Android, consulte o tutorial Como adicionar um mapa com um marcador e ative o Modo Lite para oferecer interatividade limitada.
- Em apps iOS, veja o tutorial Como adicionar um mapa com um marcador
e desativar controles e gestos
com a sinalização
GMSUiSettings
.