addEventListener to google maps in shiny to autoclose infowindows

Question

Related threads

Closing info windows in google maps by clicking the map?

Google maps api close infowindow when clicking somewhere else

Google Maps: Auto close open InfoWindows?

Problem

I am able to target all markers with the close method and iterate over them with a for loop to manually close their respective infowindows using:

for (var i = 0; i < mapgoogleMarkersdefaultLayerId.length; i++) {
        mapgoogleMarkersdefaultLayerId[i].infowindow.close();
      }

However, I am planning to have all infowindows close once the user clicks anywhere else on the map. I attempted to use an addEventListener on the map object by:

map.addEventListener("click", function(event) {
      for (var i = 0; i < mapgoogleMarkersdefaultLayerId.length; i++) {
        mapgoogleMarkersdefaultLayerId[i].infowindow.close();
      }
});

However, using the listener on the map object also captures the marker, thus immediately closing the infowindow once the user clicks the marker, resulting in nothing happening. I've tried to target various "base layers" of the google map using things such as referencing mapmap.__gm.panes.mapPane to target the mappanes below the marker with no results.

More info

I am including this script as another file in my shiny app folder and linking it to my app via includeScript("closeInfoWindows.js") in the ui.

MCVE

library(shiny)
library(googleway)

ui <- fluidPage(
  google_mapOutput(outputId = "map", height = "800px")
)

server <- function(input, output) {

  tram_stops$info <- "Make me dissappear!"
  set_key(api_key)

  output$map <- renderGoogle_map({
    google_map(data = tram_stops) %>%
      add_markers(lat = "stop_lat", lon = "stop_lon", info_window = "info")
  })
}

shinyApp(ui, server)

I don't know why this got a down-vote or a close vote, but, it's an interesting question. I've added it as [an issue](https://github.com/SymbolixAU/googleway/issues/159) on my github page as it would be a useful feature to add. — SymbolixAU, May 08 '18 at 21:56
When I try to use the `.js` code you've provided it gives errors (in chrome's console) about the `map` not being defined. Is the example `.js` code you've provided the exact code you've used in your shiny? — SymbolixAU, May 08 '18 at 22:17

SymbolixAU · Accepted Answer · 2018-05-09T10:42:58.227

I've updated the development version of googleway so you can specify close_info_window. If set to TRUE, when you click on the map, any open info windows on markers will close.

## install the development version:
devtools::install_github("SymbolixAU/googleway")

library(googleway)  ## min version: 2.6.1002

tram_stops$info <- "Make me dissappear!"
set_key(apiKey)

google_map(data = tram_stops) %>%
  add_markers(
    info_window = "info", 
    close_info_window = T
    )

Note

This is on the development branch of the package, so I may make changes without warning (to the argument name, for example). Any changes will be recorded on the github page relating to this feature

addEventListener to google maps in shiny to autoclose infowindows

1 Answers1

Note