Responding to Local Context Events

If you have a layout that should change when the place details view is shown, use the event listeners placedetailsviewshowstart and placedetailsviewhidestart. In the sample below, there are three districts indicated by custom markers. When the user clicks one of these district markers, an InfoWindow opens describing the district. If a user clicks on a POI when an InfoWindow is open, the InfoWindow will close when that POI's place details view appears and will re-open when the user closes the place details view.

Understand the code

Managing an InfoWindow with place details view events

When the place details view opens and you call InfoWindow.close(), the open InfoWindow gets removed from the DOM. In order to create the effect of "re-opening" the InfoWindow, you must store the InfoWindow's properties in a variable outside the DOM so you can recreate the InfoWindow when you want to show it again. The best time to save the information to a storage variable is when the InfoWindow is created.

let infoStorage;

function createInfoWindow(district, marker) {
  // Build the content of the InfoWindow
  let contentDiv = document.createElement('div');
  ...

  // Create and open a new InfoWindow
  infoWindow = new google.maps.InfoWindow();
  infoWindow.setContent(contentDiv);
  infoWindow.open(map, marker);

  // Store key properties of the InfoWindow for future restoration
  infoStorage = {
    'district': district,
    'marker': marker,
  };
}

Later, when the place details view is closed, you can call the same InfoWindow creation function to recreate the last InfoWindow that was open.

TypeScript

localContextMapView.addListener("placedetailsviewhidestart", () => {
  if (infoStorage) {
    createInfoWindow(infoStorage.district, infoStorage.marker);
  }
});

JavaScript

localContextMapView.addListener("placedetailsviewhidestart", () => {
  if (infoStorage) {
    createInfoWindow(infoStorage.district, infoStorage.marker);
  }
});

Updating the directions origin

Since there are multiple district markers on this map that the user can choose from, we update the origin for directionsOptions to the last clicked district using these lines in the marker's click listener. This demonstrates that directionsOptions can be updated even after localContextMapView has been initialized.

Try the sample