I am trying to create a sidebar effect inside a tabBox
for a particular tabPanel
(very similar to how shinyDashboardPlus
does it with just a box) but it's not turning out as expected using mainPanel
and sidebarPanel
.
Code:
library(shiny)
library(shinydashboard)
header <- dashboardHeader()
sidebar <- dashboardSidebar()
body <- dashboardBody(
useShinyjs(),
fluidRow(
div(id = "TimingBox",
tabBox(id = "Timing",
tabPanel("Tab 1",
mainPanel(
plotOutput("plot1")
),
div(id ="Sidebar",
sidebarPanel(
"Look here"
)
)
),
tabPanel("Tab 2"),
title = p("Status",actionLink("Link", NULL, icon = icon("plus-square-o"))), width = 4,
selected = "Tab 1"
)
)
)
)
ui <- dashboardPage(header, sidebar, body)
server <- function(input, output) {
shinyjs::hide(id = "Sidebar")
observeEvent(input$Link, {
shinyjs::toggle(id = "Sidebar")
})
set.seed(122)
histdata <- rnorm(500)
output$plot1 <- renderPlot({
data <- histdata[seq_len(50)]
hist(data)
})
}
shinyApp(ui, server)
ShinyDashboardPlus's box with sidebar (clicks on the i symbol):
Updated code:
I've worked on it some bit and realized I was missing sidebarLayout
(). However, I would still like
- The sideBar to overlay on top of the mainPanel
Have the sideBar height be the same as the mainPanel.
library(shiny) library(shinydashboard) header <- dashboardHeader() sidebar <- dashboardSidebar() body <- dashboardBody( useShinyjs(), fluidRow( div(id = "TimingBox", tabBox(id = "Timing", tabPanel("Tab 1", sidebarLayout( div(id = "Sidebar", style = "z-index: 1000;", sidebarPanel("There are currently 20 overdue here", width = 6) ), mainPanel(plotOutput("plot1"), width = 12) ) ), tabPanel("Tab 2"), title = p("Status",actionLink("Link", NULL, icon = icon("plus-square-o")),actionLink("Link2", NULL, icon = icon("search"))), width = 4, selected = "Tab 1" ) ) ) ) ui <- dashboardPage(header, sidebar, body) server <- function(input, output) { shinyjs::hide(id = "Sidebar") observeEvent(input$Link, { shinyjs::toggle(id = "Sidebar") }) set.seed(122) histdata <- rnorm(500) output$plot1 <- renderPlot({ data <- histdata[seq_len(50)] hist(data) }) } shinyApp(ui, server)