Question 318402 in CSS Question posted in
Some basic documentation can be found here.

Css – R Shiny : adjust height of DT datatable when fillContainer=TRUE,

In my R Shiny app, I have a DT datable that has too much columns for the available horizontal space of the container. I therefore use fillContainer=TRUE so that the table fits in its container and can be scrolled horizontally and vertically.

My problem is that doing so, only 2 rows are visible simultaneously, even though I have plenty of vertical space available on screen. A reproducible example is given below :

library(shiny)
library(DT)

ui <- fluidPage(
  sidebarLayout(
    sidebarPanel(dataTableOutput("DT")),
    mainPanel()
  )
)

server <- function(input, output) {
data<-mtcars
output$DT<-renderDT(
  datatable(
    data,
    fillContainer=TRUE))
}
 
shinyApp(ui = ui, server = server)

Do you have tips to easily increase the number of rows visible in the table for more readability independently of other elements that might be present in the app ? Of course, the height argument of datatable does not respond because fillContainer=TRUE. Aren’t there any option other than having to fiddle with CSS or HTML to fix the height of the container (if so, how ?) ?

Many thanks !

Tags:

2

Answers


  1. 0

    I’d suggest using scrollX = TRUE instead of fillContainer = TRUE along with a given number of rows to show (pageLength) or a given table height (scrollY = some css unit)

    library(DT)
library(shiny)
library(datasets)

data <- mtcars

ui <- fluidPage(sidebarLayout(sidebarPanel(DTOutput("DT")), mainPanel()))

server <- function(input, output) {
  output$DT <- renderDT({datatable(data, options = list(scrollX = TRUE, pageLength = 15L))}) # alternative: scrollY = "80vh"
}

shinyApp(ui = ui, server = server)
    Login or Signup to reply.
  2. 0

    Another less elegant way to do it is using fluidrow and wellPanel, to make a nicer box. Also, removing fillContainer=TRUE. You can adjust the width of the siderbar change the number of column (until 12).

    library(shiny)
library(DT)

ui <- fluidPage(
  
  fluidRow(
    column(8,
           div(
             h4("Check Data"),
             wellPanel(
               id = "wellPanelId1",
               dataTableOutput("DT"),
               style = "height:auto; overflow-y: scroll;"
               )
           )
    )
  ),
  
  mainPanel()
  
)

server <- function(input, output) {
  data<-mtcars
  output$DT<-renderDT(
    datatable(
      data))
}

shinyApp(ui = ui, server = server)

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search