Ereignisse und Nutzerinteraktionen verarbeiten

Sie können Ereignisse sowohl auf der LocalContextMapView-Instanz als auch auf der internen Karte verarbeiten. LocalContextMapView unterstützt nur zwei Ereignisse, die ausgelöst werden, wenn ein Nutzer einen Ort auswählt (die Ansicht mit den Ortsdetails öffnet) und die Ansicht wieder schließt. Mit diesen Ereignissen können Sie alle UI-Elemente aktualisieren.

  • placedetailsviewshowstart wird ausgelöst, wenn der Nutzer einen Ort auswählt, bevor die Ansicht mit den Ortsdetails angezeigt wird.
  • placedetailsviewhidestart wird ausgelöst, wenn der Nutzer die Ansicht mit den Ortsdetails schließt, bevor sie ausgeblendet wird.

Im folgenden Beispiel werden die beiden unterstützten Listener auf einer LocalContextMapView-Instanz festgelegt (das ist in der Funktion initMap() möglich):

// 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!");
});

Sie können auch UI-Ereignisse auf der Karte verarbeiten, die mit LocalContextMapView erstellt wurde. Im folgenden Beispiel wird der Ereignis-Handler ausgelöst, wenn die Karte ein Mouseover-Ereignis erkennt:

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

LocalContextMapView schließt die Ansicht mit den Ortsdetails oder die Lightbox mit Fotos auch, wenn die Esc-Taste gedrückt wird. Wenn Sie das verhindern möchten, können Sie dem Fensterobjekt einen Listener für den Tastendruck und die Esc-Taste in der Erfassungsphase hinzufügen, um das Standardverhalten zu unterbinden:

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

Um LocalContextMapView Tastaturereignisse vor Ihrem Code verarbeiten zu lassen, können Sie dem Fenster in der Infofeldphase alternativ einen Listener für den Tastendruck hinzufügen:

// 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);

Weitere Informationen