Como manipular os eventos e as interações do usuário

Devido à adoção limitada desse recurso Beta, a Biblioteca do Contexto local da API Maps JavaScript foi descontinuada na versão 3.52.2. A Biblioteca do Contexto local vai continuar funcionando até segunda ordem, mas não é recomendável adicioná-la a novos projetos.

Se você quiser criar uma experiência semelhante a essa biblioteca, confira a solução "Descoberta de bairros" no Criador rápido de soluções ou use a biblioteca Places da API Maps JavaScript. Os exemplos de código e codelabs da biblioteca Places podem ser úteis.

Este produto ou recurso está em Beta (pré-GA). Os produtos e recursos em pré-GA têm suporte limitado, e é possível que as mudanças neles não sejam compatíveis com outras versões nesse estágio. Todos os itens em pré-GA são cobertos pelos Termos de Serviço da Plataforma Google Maps. Para mais detalhes, consulte as descrições da fase de lançamento.

É possível manipular eventos na instância do LocalContextMapView e no mapa interno. O LocalContextMapView aceita apenas dois eventos, que são acionados quando um usuário seleciona um lugar (abrindo a visualização do Place Details) e quando o usuário fecha a visualização do Place Details. Esses eventos permitem atualizar os elementos da IU.

• O placedetailsviewshowstart é acionado quando o usuário seleciona um lugar, antes da visualização do Place Details.
• O placedetailsviewhidestart é disparado quando o usuário fecha a visualização do Place Details, antes da ocultação dela.

O exemplo a seguir mostra a configuração dos dois listeners compatíveis em uma instância de LocalContextMapView. É possível fazer isso na função initMap():

// Set the LocalContextMapView event handlers.
localContextMapView.addListener('placedetailsviewshowstart', () => {
  console.log("The 'placedetailsviewshowstart' event just fired!");
});

localContextMapView.addListener('placedetailsviewhidestart', () => {
  console.log("The 'placedetailsviewhidestart' event just fired!");
});

Também é possível processar eventos da interface do usuário no mapa criado com base no LocalContextMapView. O exemplo a seguir mostra um manipulador de eventos que é disparado sempre que o mapa detecta um evento de mouseover:

// Set a mouseover event handler on the inner map.
localContextMapView.map.addListener('mouseover', () => {
  console.log("The mouse just entered the map!");
});

O LocalContextMapView também fecha a visualização do Place Details ou o lightbox de fotos quando a tecla de escape é pressionada. Se você quiser alterar esse comportamento, recomendamos adicionar um listener para o evento de keydown e a tecla de escape na fase de captura ao objeto da janela para interceptar o comportamento padrão:

// Change the escape key behavior.
window.addEventListener('keydown', event => {
  if (event.key !== 'Escape') return;
  event.stopPropagation();
  // Handle the event.
  // ...
}, /* useCapture= */ true);

Como alternativa, para permitir que LocalContextMapView manipule eventos de teclado antes do código, registre um listener de keydown na janela da fase de balão:

// Won't be fired if LocalContextMapView handled the escape key to close
// the place details view or photo lightbox:
window.addEventListener('keydown', event => {
  if (event.key !== 'Escape') return;
  // Handle the event.
  // ...
}, /* useCapture= */ false);

Saiba mais

• Veja os eventos em ação. Nas amostras da Biblioteca do Contexto local, você confere os usos comuns da biblioteca, incluindo os detalhes de implementação.
• Leia mais sobre eventos na API Maps JavaScript.