Open Camil88 opened 2 years ago
Maybe the following works.
You need the package shinyjs
, initialize it with useShinyjs()
in your UI, then you can get the leaflet map using this:
$("#map").data("leafletMap")
(map is my output ID for the map) and then you should be able to trigger this:
$("#map").data("leafletMap").invalidateSize();
Full Shiny example:
library(shiny)
library(shinyjs)
library(leaflet)
ui <- navbarPage("Refresh Map",
useShinyjs(),
tabPanel("Map",
actionButton("reset", "Reset"),
leafletOutput("map")
),
tabPanel("Summary")
)
server <- function(input, output, session) {
observeEvent(input$reset, {
runjs('$("#map").data("leafletMap").invalidateSize();')
})
output$map <- renderLeaflet({
leaflet() %>%
addTiles()
})
}
shinyApp(ui, server)
Hi, in some particular case when I change tabs in my app the leaflet map disappears (to be more precise - instead of the map I see just gray canvas). I just wanted to somehow refresh/reset map programatically and get it back to initial state but don't think I can do it with this leaflet-for-shiny library. I just googled it and found some raw JS which could help to solve the problem. Unfortunately it doesn't work here. I tried setting view, remove map, fit bounds etc. but in vain. Below you can find my tries (let's say my leaflet map created in shiny is called
myMap
):I also tried to use it along with
onRender
function but in vain:None of them works for me, I always get the same error in console: Map container is already initialized And even if I try to hit this simple code to console:
var map = L.map('myMap');
I got the same error in return. Seems like I can't reach tomyMap
leaflet object. How can I solve this issue?