折叠绝对面板闪亮?

时间:2016-02-03 10:59:10

标签: r shiny

按照superZip(http://shiny.rstudio.com/gallery/superzip-example.html)的例子,是否有可能在闪亮的情况下创建一个崩溃的absoltePanel,如果有很多控件和输出,它会折叠到右下角。

感谢您的任何建议。

这是absolutePanel的最小例子:

library(shiny)

ui <- shinyUI(bootstrapPage(
    absolutePanel(
        id = "controls", class = "panel panel-default", fixed = TRUE,
        draggable = TRUE, top = 60, left = "auto", right = 20, bottom = "auto",
        width = 330, height = "auto",
        checkboxInput('input_draw_point', 'Draw point', FALSE ),
        verbatimTextOutput('summary'))
))

server <- shinyServer(function(input, output, session) {
    output$summary <- renderPrint(print(cars))

})

shinyApp(ui = ui, server = server)

2 个答案:

答案 0 :(得分:10)

Bootstrap可以创建折叠面板。但我不确定这是最好的方法:

library(shiny)

ui <- shinyUI(bootstrapPage(
    absolutePanel(
        id = "controls", class = "panel panel-default", fixed = TRUE,
        draggable = TRUE, top = 60, left = "auto", right = 20, bottom = "auto",
        width = 330, height = "auto",
        HTML('<button data-toggle="collapse" data-target="#demo">Collapsible</button>'),
        tags$div(id = 'demo',  class="collapse",
        checkboxInput('input_draw_point', 'Draw point', FALSE ),
        verbatimTextOutput('summary')))
))

server <- shinyServer(function(input, output, session) {
    output$summary <- renderPrint(print(cars))

})

shinyApp(ui = ui, server = server)

答案 1 :(得分:2)

这里是一个示例,该示例还使用了内置的闪亮控件(如果使用默认值,则可以使内容在视觉上更加一致)。

如果您未设置absolutePanel的宽度/高度(或根据需要设置fixedPanel的高度),则当您将其折叠时,它将消失。仅当您将按钮留在div中时才适用,如果将按钮放在div之外,面板将始终消失,并为您提供更多(漂亮)的大小控制。

library(shiny)

ui = fillPage(

  absolutePanel(
    top = 90, left = 10,
    tags$div(id = 'plotDiv',  class="collapse", style='background-color: #eaf2f8',
             checkboxInput('input_draw_point', 'Draw point', FALSE ),
             verbatimTextOutput('summary'))),

  fixedPanel(top = 10, left = 165,
             actionButton('plotBtn', 'Show Panel', "data-toggle"='collapse', "data-target"='#plotDiv',
                          style="opacity: .80; color: #fff; background-color: #a662e3; border-color: #a153e5"))

)

server <- shinyServer(function(input, output, session) {
  output$summary <- renderPrint(print(cars))

})

shinyApp(ui = ui, server = server)

但是,缺点是,当隐藏面板时,您无法单击面板所在位置下方的任何内容,在此示例中为地图。即使您看不到它。如果您想要更好的解决方案,可以尝试使用Shinyjs:

library(shiny)
library(shinyjs)

ui = fillPage(
  useShinyjs(),  # Set up shinyjs

  hidden( #start as hidden
    absolutePanel(
      id = 'thePanel', style='background-color: #eaf2f8',
      top = 90, left = 10,
      checkboxInput('input_draw_point', 'Draw point', FALSE ),
      verbatimTextOutput('summary')))
  ),

  fixedPanel(top = 10, left = 165,
             actionButton('plotBtn', 'Show Panel',
                          style="opacity: .80; color: #fff; background-color: #a662e3; border-color: #a153e5"))
)

server <- shinyServer(function(input, output, session) {
  output$summary <- renderPrint(print(cars))

  observeEvent(input$plotBtn, {
    toggle('thePanel')
  })

})

shinyApp(ui = ui, server = server)

对我来说,这似乎更简单明了,并且在隐藏对象时不会阻止鼠标单击。