根据它包含在闪亮仪表板中的对象调整框高度

问题描述

我有下面的 shiny 仪表板,其中包含一个包含数据表的 Box。我希望框的高度可以调整为包含的数据表(或绘图)的高度。 Box 每次从表中都应该大一点。例如,如果我设置 pageLength=10 表格会变大,那么 Box 也应该变大一点以适应。

library(shiny)
library(shinydashboard)
library(DT)

ui <- dashboardPage(
  dashboardHeader(title = "Basic dashboard"),dashboardSidebar(),dashboardBody(
    tags$head(tags$script('
      // Define function to set height of "map" and "map_container"
      setHeight = function() {
        var window_height = $(window).height();
        var header_height = $(".main-header").height();

        var BoxHeight = window_height - header_height - 30;

        $("#map_container").height(BoxHeight);
        $("#map").height(BoxHeight - 20);
      };

      // Set input$Box_height when the connection is established
      $(document).on("shiny:connected",function(event) {
        setHeight();
      });

      // Refresh the Box height on every window resize event    
      $(window).on("resize",function(){
        setHeight();
      });
    ')),# Boxes need to be put in a row (or column)
    fluidRow(
      Box(id = "map_container",dataTableOutput("map")
      )
      
    )
  )
)

server <- function(input,output) {
  set.seed(122)
  histdata <- rnorm(500)
  
  output$map <- renderDataTable( {
    datatable(iris,options = list(pageLength=5))
  })
}

shinyApp(ui,server)

解决方法

根据文档,box 的高度会根据其内容自动调整。所以如果你想让它更大一点,你可以这样做:

box(
  div(
    div(style = "height: 10px;"),DTOutput("yourID"),div(style = "height: 10px;")
  )
)