改进 selectInput 选项的可视化

Question

我如何看到所有 selectInput 选项，因为它很难看到（附图）。我认为需要调整尺寸，但我不知道该怎么做。

下面的可执行代码：

library(shiny)

ui <- fluidPage(
  
  column(4,
        
         wellPanel(
           br(),
           splitLayout(

           numericInput("weight1", label = h5("Weight 1"), min = 0, max = 1, value = NA, step = 0.1),
          
           selectInput("maxmin", label = h5("Maximize or Minimize"),choices = list("Maximize " = 1, "Minimize" = 2), 
                       selected = "")),
           
           numericInput("weight2", label = h5("Weight 2"), min = 0, max = 1, value = NA, step = 0.1),
           
           numericInput("weight3", label = h5("Weight 3"), min = 0, max = 1, value = NA, step = 0.1),
           
           numericInput("weight4", label = h5("Weight 4"), min = 0, max = 1, value = NA, step = 0.1))),
  
  hr(),
  
  column(8,
         tabsetPanel(tabPanel("table1", DTOutput('table1')))))

server <- function(input, output, session) {
  
}

shinyApp(ui = ui, server = server)

Answer 1

这是一个可能的边栏解决方案：

library(shiny)
library(shinydashboard)
library(DT)


ui <- fluidPage(
  
  # Your title
  titlePanel("My App!"),
  
  sidebarLayout(
    
    # Sidebar 
    sidebarPanel(
      fluidRow(column(width = 8,
                      fluidRow(column(4, numericInput("weight1", label = h5("Weight 1"), min = 0, max = 1, value = NA, step = 0.1)),
                               column(4, selectInput("maxmin",
                                                     label = h5("Maximize or Minimize"),
                                                     choices = list("Maximize " = 1, "Minimize" = 2), 
                                                     selected = "")
                                      )
                               )
                      )
               ),
      hr(),
      fluidRow(
        column(width = 8,
               numericInput("weight2", label = h5("Weight 2"), min = 0, max = 1, value = NA, step = 0.1),
               numericInput("weight3", label = h5("Weight 3"), min = 0, max = 1, value = NA, step = 0.1),
               numericInput("weight4", label = h5("Weight 4"), min = 0, max = 1, value = NA, step = 0.1)
               )
        )
      ),
    # Table
    mainPanel(
      tabsetPanel(tabPanel("table1", DTOutput('table1'))
                  )
      )
    )
  )

server <- function(input, output, session) {
  
}

shinyApp(ui = ui, server = server)

Answer 2

splitLayout加一个CSS属性overflow: auto。这导致高度被固定。如果添加了动态内容，是滚动窗格，只是在错误的位置（尝试滚动下拉菜单）。

您可以在其中嵌套一个 fluidRow 和两个 column 元素，每个元素的宽度为 6，而不是使用 splitLayout。

您还将边栏和内容包装到两个 column 对象中，一个宽度为 4，另一个宽度为 8。考虑在此用例中使用 sidebarPanel相反。

最终代码可能如下所示：

library(shiny)

ui <- fluidPage(
  sidebarLayout(
    sidebarPanel(
      fluidRow(
        column(
          width = 6,
          numericInput("weight1", label = h5("Weight 1"), min = 0, max = 1, value = NA, step = 0.1)
        ),
        column(
          width = 6,
          selectInput("maxmin", label = h5("Maximize or Minimize"),choices = list("Maximize " = 1, "Minimize" = 2), selected = "")
        )
      ),
      numericInput("weight2", label = h5("Weight 2"), min = 0, max = 1, value = NA, step = 0.1),
      numericInput("weight3", label = h5("Weight 3"), min = 0, max = 1, value = NA, step = 0.1),
      numericInput("weight4", label = h5("Weight 4"), min = 0, max = 1, value = NA, step = 0.1),
    ),
    mainPanel(
      p("sth should be there")
    )
  )
)

server <- function(input, output, session) {
  
}

shinyApp(ui = ui, server = server)

改进 selectInput 选项的可视化

Improve visualization of selectInput options

r

shiny