Shiny 模块应用中传单地图的高度

Question

我想将我的小应用程序作为下一个模块添加到我的大应用程序中。一切正常，除了...传单地图高度。 在独立应用程序中我有：

ui <- fluidPage(
  tags$style(type = "text/css", "#map {height: calc(700px) !important;}"),
  fluidRow(leafletOutput("map"))
)

当我将其转换为模块时，我尝试过：

moduleUI <- function(id){
  ns <- NS(id)
  tags$style(type = "text/css", paste0("#", ns("map"), " {height: calc(700px) !important;}"))
  fluidRow(leafletOutput(ns("map")))
}

---

moduleUI <- function(id){
  ns <- NS(id)
  tags$style(type = "text/css", "#nsValue-map {height: calc(700px) !important;}"))
  fluidRow(leafletOutput(ns("map")))
}

不幸的是这些建议都不起作用，传单对象仍然是 400px 而不是 700px。

代码应该是什么样子才能使地图高度为 700 像素？

---

编辑：添加示例

library(shiny)
library(leaflet)

moduleUI     <- function(id){
  ns <- NS(id)
  tags$style(type = "text/css", "#map {height: calc(700px) !important;}")
  titlePanel("Leaflet Map")
  sidebarLayout(
    sidebarPanel(
      numericInput(ns("lat"), "Latitude:", value = 0),
      numericInput(ns("lng"), "Longitude:", value = 0),
      actionButton(ns("submit"), "Submit")
    ),
    mainPanel(
      leafletOutput(ns("map"), height = 300)
    )
  )
}
moduleServer <- function(input, output, session){
  ns <- session$ns

  output$map <- renderLeaflet({
    leaflet() %>%
      addTiles() %>%
      setView(lng = 0, lat = 0, zoom = 2)
  })
  
  observeEvent(input$submit, {
    lat <- input$lat
    lng <- input$lng
    
    leafletProxy("map") %>%
      clearMarkers() %>%
      addMarkers(lng = lng, lat = lat)
  })
}
  
ui     <- fluidPage(moduleUI("module_id"))
server <- function(input, output) {callModule(moduleServer, "module_id")}

shinyApp(ui, server)

Answer 1

我建议您不要使用 id，而是使用类，这样在转换为模块时也不会出现问题。

tags$style(type = "text/css", ".leaflet {height: calc(900px) !important;}")

除此之外

leafletOutput

还有宽度

leafletOutput("map", height = 700)

这是一个完整的工作示例

library(shiny)
library(leaflet)

ui <- fluidPage(
  # Uncomment this if you want to use css style instead.
  # tags$style(type = "text/css", "#map {height: calc(700px) !important;}"),
  titlePanel("Leaflet Map"),
  sidebarLayout(
    sidebarPanel(
      numericInput("lat", "Latitude:", value = 0),
      numericInput("lng", "Longitude:", value = 0),
      actionButton("submit", "Submit")
    ),
    mainPanel(
      leafletOutput("map", height = 300)
    )
  )
)

server <- function(input, output) {
  output$map <- renderLeaflet({
    leaflet() %>%
      addTiles() %>%
      setView(lng = 0, lat = 0, zoom = 2)
  })
  
  observeEvent(input$submit, {
    lat <- input$lat
    lng <- input$lng
    
    leafletProxy("map") %>%
      clearMarkers() %>%
      addMarkers(lng = lng, lat = lat)
  })
}

shinyApp(ui, server)