在 RShiny 中制作传单地图全屏

Question

我无法在 Shiny 中全屏制作传单地图。虽然我显然可以手动将地图的宽度和高度设置为我的屏幕尺寸，但我希望地图适应它所显示的任何屏幕尺寸。

如何自动调整地图大小？

这是迄今为止我一直在尝试的代码。然而不幸的是，这并不能正确调整高度。

library(shiny)
library(leaflet)

location=c(46.52433,10.12633)

ui <- fluidPage(
  tags$head(tags$style(HTML("#map {height:100%, width:100%;}"))),

  leafletOutput("map")


)

server <- function(input, output, session) {

  output$map = renderLeaflet({
    leaflet() %>% addTiles()  %>% setView(lat = location[1],lng = location[2],zoom = 10) %>% 
      addMarkers(lat = location[1],lng = location[2],popup = "Test") })


}


shinyApp(ui, server)

任何帮助将不胜感激，谢谢！

Answer 1

尝试将width = "100%", height = "100%" 添加到leafletOutput 并使用fillPage()，如下所示：

library(shiny)
library(leaflet)

location=c(46.52433,10.12633)

ui <- fillPage(
  tags$style(type = "text/css", "html, body {width:100%; height:100%}"),
  leafletOutput("map", width = "100%", height = "100%")

  )

server <- function(input, output, session) {

  output$map = renderLeaflet({
    leaflet() %>% addTiles()  %>% setView(lat = location[1],lng = 
location[2],zoom = 10) %>% 
      addMarkers(lat = location[1], lng = location[2],popup = "Test") })


}


shinyApp(ui, server)

Answer 2

使用 JavaScript：

js <- '
$(document).on("shiny:connected", function(){
  $("#map").css({
    width: window.innerWidth, 
    height: window.innerHeight
  });
  $(window).on("resize", function(e){
    if(e.target instanceof Window){
      $("#map").css({width: window.innerWidth, height: window.innerHeight});
    }
  });
})
'
location=c(46.52433,10.12633)

ui <- fluidPage(
  tags$head(
    tags$style(HTML("html,body {margin: 0; overflow: hidden;}")),
    tags$script(HTML(js))
  ),
  ......