Locking R shiny dashboard sidebar (shinydashboard) - r

Question

I'm getting stuck while building a Shiny Dashboard in R (using the shinydashboard package). I want to lock my sidebar so that it does not scroll while I look through the content of my tabs, but I'm not sure how to pull this off.
As an example, the following block of code will create a long-scrolling dashboard. It would be nice to lock the sidebar so that you can still see the menu tabs whilst scrolling through the obscenely-long data table.
library(ggplot2) ## for mpg dataset
library(shinydashboard)
## ui
ui <- dashboardPage(
dashboardHeader(title="MPG Data"),
dashboardSidebar(sidebarMenu(menuItem("MPG", tabName="mpg"))),
dashboardBody(tabItems(tabItem(tabName="mpg", fluidRow(tableOutput("mpgTable"))))))
## server
server <- function(input, output) {
output$mpgTable <- renderTable({mpg})
}
## launch dashboard
shinyApp(ui, server)

Answer 1

You should just add the style = "position:fixed; overflow: visible" at the ui sidebar.
library(ggplot2) ## for mpg dataset
library(shinydashboard)
## ui
ui <- dashboardPage(
dashboardHeader(title="MPG Data"),
dashboardSidebar(
sidebarMenu(style = "position: fixed; overflow: visible;",
menuItem("MPG", tabName="mpg"))),
dashboardBody(
tabItems(
tabItem(tabName="mpg",
fluidRow(tableOutput("mpgTable"))))))
## server
server <- function(input, output) {
output$mpgTable <- renderTable({mpg})
}
## launch dashboard
shinyApp(ui, server)

Answer 2

**disclaimer: I am no css expert by any means
You can set the option in DT for the actual table but if you want to have the tab in the actual dashboard scroll free from the sidebar(assuming you aren't using a navbar based on your code) give this a shot:
the css would look like this:
.sidebar {
color: #FFF;
position: fixed;
width: 220px;
white-space: nowrap;
overflow: visible;
}
if you have a .css file working in your 'www' folder you can call it from the ui with a number of functions; so let's assume your file is named "style.css".
the ui now looks like this:
dashboardPage(
dashboardHeader(title="MPG Data"),
dashboardSidebar(
sidebarMenu(
menuItem("MPG",tabName="mpg")
)
),
dashboardBody(
#here's where you throw the css into the header
tags$head(
includeCSS('www/style.css')
),
tabItems(
tabItem(tabName="mpg",
fluidRow(tableOutput("mpgTable"))
)
)
)
)
Nothing on the server side changes, but you might want to check out using DT or setting options in your table to work more easily with the data. DT package ref.
Hope this helps.

Answer 3

#HipHopPhysician can you post what you're trying to run? otherwise here's the simplest way to use DT as a workaround...there are a lot of options to set; so i'm just going to give the default:
library(ggplot2)
library(DT)
library(shinydashboard)
ui <-
dashboardPage(
dashboardHeader(title="MPG Data"),
dashboardSidebar(
sidebarMenu(
menuItem("MPG",tabName="mpg")
)
),
dashboardBody(
#here's where you throw the css into the header
tags$head(
includeCSS('www/style.css')
),
tabItems(
tabItem(tabName="mpg",
dataTableOutput("mpgTable"))
)
)
)
server <- function(input, output) {
output$mpgTable <- renderDataTable({ mpg })
}