在闪亮中创建有条件可见的侧边栏

Question

在 R 和 shiny 中，我想在 shinydashboard 中使用制表符。仪表板通常有侧边栏，但对于一个选项卡，我希望侧边栏消失，以便为页面主体提供更多屏幕 space。

我知道有条件面板，但是否可以在激活选项卡时调整侧边栏的可见性？

下面是一些模拟代码，用于设置带有三个选项卡和一个侧边栏的 shinydashboard。

library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(),
  # I would like to make the sidebar not visible if the third tab is selected...
  # something like...
  #if(input.tabs==3){dashboardSidebar(disable = TRUE)}else{dashboardSidebar()},
  dashboardSidebar(),
  if(input.tabs==3){dashboardSidebar(disable = TRUE)}else{dashboardSidebar()},
  dashboardBody(
      fluidRow(
        column(width=12,
               tabsetPanel(id='tabs'
                 tabPanel('tab1',
                          plotOutput('plot1'),value=1),
                 tabPanel('tab2',
                          plotOutput('plot2'),value=2),
                 tabPanel('tab3',
                          plotOutput('plot3'),value=3)
               )
        ))
    )
)

server <- function(input, output) { 
  output$plot1 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })
  output$plot2 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
      print(out)
  })
  output$plot3 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
      print(out)
  })
}

shinyApp(ui, server)

Answer 1

直到 5 分钟前我看到这个问题时我才使用过仪表板，所以这可能不是最佳答案，但它确实有效。

看起来当您手动 "hide" 侧边栏时，body 标签得到一个 "sidebar-collapse" class。所以我的解决方案是添加 javascript，即在选择第三个选项卡时将 class 添加到 body 标记。 The one downside is that when another tab is chosen, the sidebar will not re-expand, it will stay hidden until you manually expand it again.

免责声明：在我的回答中，我使用了我编写的包 shinyjs。

这是闪亮的应用程序：

library(shiny)
library(shinydashboard)
library(ggplot2)
library(shinyjs)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    extendShinyjs("app.js"),
    fluidRow(
      column(width=12,
             tabsetPanel(id='tabs',
                         tabPanel('tab1',
                                  plotOutput('plot1'),value=1),
                         tabPanel('tab2',
                                  plotOutput('plot2'),value=2),
                         tabPanel('tab3',
                                  plotOutput('plot3'),value=3)
             )
      ))
  )
)

server <- function(input, output, session) { 
  output$plot1 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })
  output$plot2 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })
  output$plot3 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })

  observe({
    if (input$tabs == 3) {
      js$hideSidebar()
    }
  })
}

shinyApp(ui, server)

我只向您的应用程序添加了几行：我在 UI 中添加了对 useShinyjs() 和 extendShinyjs("app.js") 的调用，并向服务器添加了 observe({ if (input$tabs == 3) js$hideSidebar() })。我还在服务器函数中添加了 session 参数。您还需要添加一个名为 "app.js" 的 javascript 文件，其中包含以下行：

shinyjs.hideSidebar = function(params) { $("body").addClass("sidebar-collapse") }

您也可以避免使用 shinyjs 并使用 shiny 的正常消息传递来调用类似的 javascript 函数。

编辑： 使用最新的 shinyjs 版本 0.0.6.1 如果您更愿意提供内联的 javascript 代码，则不需要使用单独的文件。只需将对 extendShinyjs("app.js") 的调用替换为

extendShinyjs(text = 'shinyjs.hideSidebar = function(params) { $("body").addClass("sidebar-collapse") }')

在闪亮中创建有条件可见的侧边栏

Creating conditionally visible sidebars in shiny

r

shiny