定位 R 闪亮的 selectInput 小部件

Question

请运行下面的 R 闪亮脚本，我需要有关将两个 selectInputs 移动到其当前位置上方一点的帮助。目前 selectInput 下拉菜单显示不清晰。我尝试使用填充但没有用。附上快照以供参考。请帮忙。

## app.R ##
library(shiny)
library(shinydashboard)
library(plotly)
ui <- dashboardPage(
dashboardHeader(title = "first Chart"),
dashboardSidebar(
width = 0),
dashboardBody(
box(
  splitLayout(

    cellArgs = list(style = "padding: 2px;padding-top:0px;"),

  selectInput("stats1", "", c("Time","Cases"),selected = "Time", width = 
  "400"),
  selectInput("stats2", "", c("Time","Cases"),selected = "Time", width = 
  "400")),
  title = "Sankey Chart", status = "primary",height = "535" ,solidHeader = 
  T,
    plotlyOutput("first_plot"))))
    server <- function(input, output) 
    { 
    output$first_plot <- renderPlotly({
    p <- plot_ly(
    x = c("giraffes", "orangutans", "monkeys"),
    y = c(20, 14, 23),
    name = "SF Zoo",
    type = "bar"
    )
    })
    }
    shinyApp(ui, server)

Answer 1

这是使用 fluidRow 和 column 创建 UI 的另一种方法，我认为这可以解决您的问题 - 下拉菜单现在可以正常工作。希望这会有所帮助！

## app.R ##
library(shiny)
library(shinydashboard)
library(plotly)
ui <- dashboardPage(
  dashboardHeader(title = "first Chart"),
  dashboardSidebar(
    width = 0),
  dashboardBody(
    box(      title = "Sankey Chart", status = "primary",height = "535" ,solidHeader = 
                T,
fluidRow(width=12,
         column(width=6,
        selectInput("stats1", "", c("Time","Cases"),selected = "Time", width = 
                      "400")),
        column(width=6,
        selectInput("stats2", "", c("Time","Cases"),selected = "Time", width = 
                      "400"))),
fluidRow(
column(width=12,
      plotlyOutput("first_plot"))))))

server <- function(input, output) 
{ 
  output$first_plot <- renderPlotly({
    p <- plot_ly(
      x = c("giraffes", "orangutans", "monkeys"),
      y = c(20, 14, 23),
      name = "SF Zoo",
      type = "bar"
    )
  })
}
shinyApp(ui, server)

---

框标题和 selectInputs 之间空间较小的替代方案：

## app.R ##
library(shiny)
library(shinydashboard)
library(plotly)
ui <- dashboardPage(
  dashboardHeader(title = "first Chart"),
  dashboardSidebar(
    width = 0),
  dashboardBody(
    box(      title = "Sankey Chart", status = "primary",height = "535" ,solidHeader = 
                T,
              div(id='my_div',style='margin-top:-20px;',
              fluidRow(width=12,
                       column(width=6,
                              selectInput("stats1", "", c("Time","Cases"),selected = "Time", width = 
                                            "400")),
                       column(width=6,
                              selectInput("stats2", "", c("Time","Cases"),selected = "Time", width = 
                                            "400")))),
              fluidRow(
                column(width=12,
                       plotlyOutput("first_plot"))))))

server <- function(input, output) 
{ 
  output$first_plot <- renderPlotly({
    p <- plot_ly(
      x = c("giraffes", "orangutans", "monkeys"),
      y = c(20, 14, 23),
      name = "SF Zoo",
      type = "bar"
    )
  })
}
shinyApp(ui, server)

Answer 2

如果您想保持原来的方式而不是fluidRow，您只需将填充更改为仅将其添加到底部。

library(shiny)
library(shinydashboard)
library(plotly)
ui <- dashboardPage(
dashboardHeader(title = "first Chart"),
dashboardSidebar(
width = 0),
dashboardBody(
box(
  splitLayout(

    cellArgs = list(style = "padding: 0px 0px 70px 0px;"),

  selectInput("stats1", "", c("Time","Cases"),selected = "Time", width = 
  "400"),
  selectInput("stats2", "", c("Time","Cases"),selected = "Time", width = 
  "400")),
  title = "Sankey Chart", status = "primary",height = "535" ,solidHeader = 
  T,
    plotlyOutput("first_plot"))))
    server <- function(input, output) 
    { 
    output$first_plot <- renderPlotly({
    p <- plot_ly(
    x = c("giraffes", "orangutans", "monkeys"),
    y = c(20, 14, 23),
    name = "SF Zoo",
    type = "bar"
    )
    })
    }
    shinyApp(ui, server)

因此，如果您为填充提供 4 个值而不是 1 个，它们将被分配为 top right bottom left。