How to pass leaflet map to another module?

[Camil88]

I write an app using golem and have some difficulty with modules and leaflet. In general, I added leaflet map to my app's body (located in main module) and what I want to do is to write some other modules which refer to my main map (showing/hiding points on a map and other spatial operations). I try to refer somehow to this map from other modules. In example below I passed map as reactive expression from main module but when I press button which shows points on the map then the following error comes up:

Error in if: missing value where TRUE/FALSE needed

Is it possible at all to pass map to another module? And use leafletProxy there? Unfortunately, I can't find the answer to this question anywhere, I don't even know if such 'passing' is possible. Here is reproducible example:

library(shiny)
library(dplyr)
library(sf)
library(leaflet)

moduleServer <- function(id, module) {
    callModule(module, id)
}

# Main module - UI 1 #
mod_btn_UI1 <- function(id) {
    
    ns <- NS(id)
    tagList(
        leafletOutput(ns("map")),
        mod_btn_UI2(ns("other"))
    )
}

# Main module - Server 1 #
mod_btn_server1 <- function(id){
    moduleServer(id, function(input, output, session) {
        
      ns <- NS(id)
      
      # here I pass map as reactive
      passMap = reactive({input$map})
      
      coords <- quakes %>%
        sf::st_as_sf(coords = c("long","lat"), crs = 4326)
        
        output$map <- leaflet::renderLeaflet({
          leaflet::leaflet() %>% 
            leaflet::addTiles() %>% 
            leaflet::setView(172.972965,-35.377261, zoom = 4) %>%
            leaflet::addCircleMarkers(
              data = coords,
              stroke = FALSE,
              radius = 6)
        })
        
        mod_btn_server2("other", passMap)              
    })
}


# Other module - UI 2 #
mod_btn_UI2 <- function(id) {
  
  ns <- NS(id)
  tagList(
    actionButton(inputId = ns("btn"), label = "show points")
  )
}


# Other module - Server 2 #
mod_btn_server2 <- function(id, passMap){
  moduleServer(id, function(input, output, session) {
    
    ns <- NS(id)
    
    coords <- quakes %>%
      sf::st_as_sf(coords = c("long","lat"), crs = 4326)
    
    observeEvent(input$btn, {
      leaflet::leafletProxy(passMap()) %>%
        leaflet::addCircleMarkers(
          data = coords,
          stroke = TRUE,
          color = "red",
          radius = 6)
    })  
  })
}

# Final app #

ui <- fluidPage(   
    tagList(
        mod_btn_UI1("test-btn"))
)

server <- function(input, output, session) {    
    mod_btn_server1("test-btn")    
}

shinyApp(ui = ui, server = server)

[ColinFay]

Hey,

Here are how to fix your issue:

• What you are passing to leafletProxy is the map id
• The leafletProxy() needs to be called in the same session of the renderLeaflet()

So :

1. Change your mod_btn_server2 to take a map_id and the session object from mod_btn_server1.
2. Inside mod_btn_server2, call leafletProxy with mapId = map_id and session = parent_session

Here is a working example:

library(shiny)
library(dplyr)
library(sf)
library(leaflet)

# Turning this into a function
coords <- function(){
  quakes %>%
    sf::st_as_sf(
      coords = c("long","lat"), 
      crs = 4326
    )
}

mod_btn_UI1 <- function(id) {
  ns <- NS(id)
  tagList(
    leafletOutput( ns("map") ),
    mod_btn_UI2( ns("other") )
  )
}

mod_btn_server1 <- function(id){
  moduleServer(id, function(input, output, session) {
    
    ns <- NS(id)
    
    output$map <- renderLeaflet({
      leaflet() %>% 
        addTiles() %>% 
        setView(172.972965,-35.377261, zoom = 4) %>%
        addCircleMarkers(
          data = coords(),
          stroke = FALSE,
          radius = 6
        )
    })
    
    mod_btn_server2(
      "other",
      # We pass both the map id and the session object from mod_btn_server1
      # This will allow leafletProxy to look for the "map" id 
      # into mod_btn_server1 instead of looking for "map" inside mod_btn_server2
      map_id = "map", 
      parent_session = session
    )              
  })
}

mod_btn_UI2 <- function(id) {
  
  ns <- NS(id)
  tagList(
    actionButton(
      inputId = ns("btn"), 
      label = "show points"
    )
  )
}

mod_btn_server2 <- function(id, map_id, parent_session){
  moduleServer(id, function(input, output, session) {
    
    ns <- NS(id)

    observeEvent(input$btn, {
      leafletProxy(
        # Taking the mapId from the parent module
        mapId = map_id,
        # Evaluating the mapId inside the parent module
        # instead of inside itself
        session = parent_session
      ) %>%
        addCircleMarkers(
          data = coords,
          stroke = TRUE,
          color = "red",
          radius = 6
        )
    })  
  })
}


ui <- fluidPage(   
  tagList(
    mod_btn_UI1("test-btn")
  )
)

server <- function(input, output, session) {    
  mod_btn_server1("test-btn")    
}

shinyApp(ui = ui, server = server)

[Camil88]

So here is the trick! Wow, it works perfectly fine! Thanks for your great help :)

[Camil88]

I have additional question here. I try to catch geometry of drawn features (polygons). In case "map" is located in main module then this code works fine:

polygon_geometry <- reactive({input$map_draw_new_feature$geometry$coordinates[[1]]})

but when I pass "map" to another module (using your nice solution) and try to use the above code then it doesn't work, no geometries are returned:

polygon_geometry <- reactive({input$map_id_draw_new_feature$geometry$coordinates[[1]]})

I also tried change parameter name to the one not using underline e.g. "mapOne" but it also doesn't work. Seems like I can't use passed map id as input, I should seemingly use the original "map" and then input$map_... Do you have an idea how to get around it?

I also created a new topic on SO, there is reproducible example: https://stackoverflow.com/questions/67306132/how-to-access-leaflet-map-passed-using-input