在有光泽的条件下创建有条件可见的侧边栏

Question

在R和shiny,我想使用选项卡shinydashboard.仪表板通常有一个侧边栏,但是对于一个标签我想侧边栏消失,以便为页面主体提供更多的屏幕空间.

我知道有条件面板,但是当激活标签时是否可以调整侧边栏的可见性？

下面是一些模拟代码,用于设置带有三个选项卡和侧边栏的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分钟前我才看到这个问题,我从未使用过仪表板,所以这可能不是最好的答案,但它确实有效.

看起来当您手动"隐藏"侧边栏时,body标记会出现"侧边栏折叠"类.所以我的解决方案是添加javascript,在选择第三个选项卡时将该类添加到body标签.一个缺点是,当选择另一个选项卡时,侧边栏将不会重新展开,它将保持隐藏,直到您再次手动展开它.

免责声明:在我的回答中,我使用了我写的包,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)

我只加了几行到您的应用程序:我添加调用useShinyjs()并extendShinyjs("app.js")在用户界面中,我加入observe({ if (input$tabs == 3) js$hideSidebar() })到服务器.我还将session参数添加到服务器功能.您还需要添加一个名为"app.js"的javascript文件,其中包含以下行:

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

您还可以避免使用shinyjs和使用闪亮的普通消息传递来调用类似的javascript函数.

编辑:使用最新的shinyjs版本0.0.6.1如果您希望内联提供javascript代码,则不需要使用单独的文件.只需将呼叫替换extendShinyjs("app.js")为

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