【问题标题】:Flexdashboard - leaflet not full screenFlexdashboard - 传单不是全屏
【发布时间】:2021-05-01 22:16:07
【问题描述】:

我正在处理uber dataset。我希望地图完全适合屏幕。这是我的代码目前的样子:

问题是如果你启用垂直布局:滚动然后传单会产生问题。

title: "random"
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    vertical_layout: scroll
runtime: shiny

shinyApp(
    fluidPage(
        leafletOutput(outputId = "df_map",height = 1300),
        absolutePanel(
            draggable = TRUE, top = "15%", left = "auto", right = "5%", class = "card",bottom = "auto",
            width = '20%', height = 'auto', fixed = TRUE,
            p(strong("Please select the parameters")),
            pickerInput(inputId = "BaseInput", label = "Base selection:", choices = unique(yr_2014$Base), 
                             multiple = F,options = list(`actions-box` = TRUE), selected =unique(yr_2014$Base) ),
            pickerInput(inputId = "MonthInput", label = "Month selection:", choices = unique(yr_2014$month), 
                             multiple = F,options = list(`actions-box` = TRUE), selected = unique(yr_2014$month)),
            sliderInput(inputId = "DayInput", "Day Selection", min=1, max=31, 
                value=c(1, 31), sep=""),
            sliderInput(inputId = "HourInput", "Hour Selection", min=0, max=23, 
                value=c(0, 23), sep="")
            
        )
    ),
    server = function(input, output, session) {
       
      df_maps <- reactive({
  yr_2014 %>%
    dplyr::filter(Base %in% input$BaseInput,month %in% input$MonthInput, day >= input$DayInput[1],
                   day <= input$DayInput[2], hour>=input$HourInput[1],hour<=input$HourInput[2])
       })

        output$df_map <- renderLeaflet({
        leaflet() %>% 
            addTiles() %>% 
            addFullscreenControl(pseudoFullscreen   =F) %>%
            addCircles(data = df_maps(), lng = ~Lon, lat = ~Lat, weight = 15, radius = 15)
        })
    }
)

请告诉我如何解决它

【问题讨论】:

    标签: r leaflet shinydashboard flexdashboard


    【解决方案1】:

    您可以根据自己的选择调整leafletOutput中的heightwidth

    leafletOutput(outputId = "df_map",height = 800, width = 1000),
    

    完整代码:

    library(shiny)
    library(leaflet.extras)
    library(shinyWidgets)
    
    shinyApp(
      fluidPage(
        leafletOutput(outputId = "df_map",height = 800, width = 1000),
        absolutePanel(
          draggable = TRUE, top = "15%", left = "auto", right = "5%", class = "card",bottom = "auto",
          width = '20%', height = 'auto', fixed = TRUE,
          p(strong("Please select the parameters")),
          pickerInput(inputId = "BaseInput", label = "Base selection:", choices = unique(yr_2014$Base), 
                      multiple = F,options = list(`actions-box` = TRUE), selected =unique(yr_2014$Base) ),
          pickerInput(inputId = "MonthInput", label = "Month selection:", choices = unique(yr_2014$month), 
                      multiple = F,options = list(`actions-box` = TRUE), selected = unique(yr_2014$month)),
          sliderInput(inputId = "DayInput", "Day Selection", min=1, max=31, 
                      value=c(1, 31), sep=""),
          sliderInput(inputId = "HourInput", "Hour Selection", min=0, max=23, 
                      value=c(0, 23), sep="")
          
        )
      ),
      server = function(input, output, session) {
        
        df_maps <- reactive({
          yr_2014 %>%
            dplyr::filter(Base %in% input$BaseInput,month %in% input$MonthInput, day >= input$DayInput[1],
                          day <= input$DayInput[2], hour>=input$HourInput[1],hour<=input$HourInput[2])
        })
        
        output$df_map <- renderLeaflet({
          leaflet() %>% 
            addTiles() %>% 
            addFullscreenControl(pseudoFullscreen   =F) %>%
            addCircles(data = df_maps(), lng = ~Lon, lat = ~Lat, weight = 15, radius = 15)
        })
      }
    )
    

    【讨论】:

    • 如果你在开始时启用了垂直布局:滚动,那么它将不起作用。我仍然面临同样的问题。
    • 请再看看我上面的代码。垂直滚动的东西产生了一个问题。我无法禁用垂直布局,因为它会在我的仪表板中的其他网页上造成混乱。
    • 你在哪里运行这个?是降价文档吗?我如何重现这个?
    • @kav 在markdown文档中使用它似乎对我来说很好。
    • 当你运行这个代码块时,它会打开一个新的浏览器窗口?
    猜你喜欢
    • 2021-10-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-10-19
    • 1970-01-01
    • 2014-09-22
    • 2015-07-18
    • 2015-03-07
    相关资源
    最近更新 更多