I am trying to display the data table is R shiny and passing the width argument in the syntax. But, the table is not displaying to the full width. So, I am trying to reduce the gap between table and input slider. Any help appreciated. Below is the syntax and image from the output.
#### Required Packages
Pckg_to_Inst = c("dashboardthemes", "shiny", "shinythemes",
"shinydashboard", "shinyWidgets", "DT", "bslib", "thematic", "shinydashboardPlus", "summaryBox")
##### Defining Negation
'%not_in%' = Negate('%in%')
for(i in 1:length(Pckg_to_Inst)){
if(Pckg_to_Inst[i] %not_in% installed.packages()) install.packages(Pckg_to_Inst[i],
dependencies = TRUE)
library(Pckg_to_Inst[i], character.only = TRUE)
}
#######################################################
ui <- fluidPage(
titlePanel("Dashboard"),
br(),
navbarPage("",
###### Here : insert shinydashboard dependencies ######
header = tagList(
useShinydashboard()
),
#######################################################
navbarMenu("Data Tracker", icon = icon("database"),
tabPanel("Test", fluid = TRUE,
hr(),
fluidRow(
column(12,
uiOutput("summarybox"))
),
hr(),
fluidRow(
column(8,
column(width = 12,
mainPanel(DT::dataTableOutput("table1")))),
column(4,
box(
width = 12,
title = "Data Secription - ",
selectInput(inputId = "Data_Type",
label = "Select Time Frame/Data Type",
choices = c("A", "B", "C", "D"),
selected = "A",
width = "220px"),
background = "black",
"A box with a solid black background"
)))
))
))
server <- function(input, output) {
output$table1 <- DT::renderDataTable({
DT::datatable(iris, class = 'cell-border stripe',
options = list(
initComplete = JS(
"function(settings, json) {","$(this.api().table().header()).css({'background-color': 'teal', 'color': 'black'});","}"),
scrollX = TRUE,
scrollY = TRUE,
pageLength = 5),
extensions = 'Buttons',
selection = 'single', ## enable selection of a single row
filter = 'top', ## include column filters at the bottom
)
})
}
shinyApp(ui, server)
And attached is the output image. 
CodePudding user response：
Your DT::dataTableOutput("table1") is inside a mainPanel and by default, mainPanel has a width of 8 (the sidebar is taking the other 4).
from ?mainPanel:
Usage sidebarLayout( sidebarPanel, mainPanel, position = c("left", "right"), fluid = TRUE )
sidebarPanel(..., width = 4)
mainPanel(..., width = 8)
CodePudding user response：
You can give a custom height and width to dataTableOutput.
library(shiny)
ui <- fluidPage(
titlePanel("Dashboard"),
br(),
navbarPage("",
###### Here : insert shinydashboard dependencies ######
header = tagList(
useShinydashboard()
),
#######################################################
navbarMenu("Data Tracker", icon = icon("database"),
tabPanel("Test", fluid = TRUE,
hr(),
fluidRow(
column(12,
uiOutput("summarybox"))
),
hr(),
fluidRow(
column(8,
column(width = 12, mainPanel(DT::dataTableOutput("table1", width = '800px')))),
column(4,
box(
width = 12,
title = "Data Secription - ",
selectInput(inputId = "Data_Type",
label = "Select Time Frame/Data Type",
choices = c("A", "B", "C", "D"),
selected = "A",
width = "220px"),
background = "black",
"A box with a solid black background"
)))
))
))
server <- function(input, output) {
output$table1 <- DT::renderDataTable({
DT::datatable(iris, class = 'cell-border stripe',
options = list(
initComplete = JS(
"function(settings, json) {","$(this.api().table().header()).css({'background-color': 'teal', 'color': 'black'});","}"),
scrollX = TRUE,
scrollY = TRUE,
pageLength = 5),
extensions = 'Buttons',
selection = 'single', ## enable selection of a single row
filter = 'top', ## include column filters at the bottom
)
})
}
shinyApp(ui, server)
