我正在創建一個帶有傳單地圖的 RShiny 儀表板；我希望我的地圖是全屏的，但我似乎無法讓邊界/邊距消失。我已經嘗試過上一篇文章
uj5u.com熱心網友回復：
如果要在頁面上最大化地圖到導航欄、左右和底部，請嘗試以下操作，但它可能對您來說太快和太臟了。
它通過 CSS 禁用 Shiny 組件的填充/邊距：
library(leaflet)
library(shiny)
# UI
ui <- navbarPage("Dashboard",
tabPanel("Fullscreen Map",
fillPage(
leafletOutput("map", width = "100vw", height = "100vh"))
),
header=tags$style(HTML("
.container-fluid{
padding: 0px !important;
}
.navbar{
margin-bottom: 0px !important;
}"))
)
# FUNCTION
server <- function(input, output, session) {
output$map <- renderLeaflet({
leaflet() %>%
addTiles() %>%
setView(lat = 0, lng = 0, zoom = 5)
})
}
# RUN APP
shinyApp(ui = ui, server = server)
編輯：JavaScript 版本
library(leaflet)
library(shiny)
# UI
resizeJS <- "
function resizeMap(e){
$('#map').css({top: $('.navbar').height() });
}
$(window).on('resize', resizeMap);
$(window).ready(resizeMap);
"
ui <- navbarPage("Dashboard",
tabPanel("Fullscreen Map",
fillPage(
leafletOutput("map", width = "auto", height = "auto"))
),
header=tags$head( tags$style(HTML("
#map{
border: 3px solid red; /* display border around the map */
position: fixed;
left: 0px;
right: 0px;
bottom: 0px;
top: 0px;
}
.navbar{
margin-bottom: 0px !important;
}")),
tags$script(resizeJS))
)
# FUNCTION
server <- function(input, output, session) {
output$map <- renderLeaflet({
leaflet() %>%
addTiles() %>%
setView(lat = 0, lng = 0, zoom = 5)
})
}
# RUN APP
shinyApp(ui = ui, server = server)
這應該使地圖與視窗完美對齊。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/482655.html