ShinyDashboard --在同一行上显示超过3个infoBoxes

Question

我想在同一行中显示4 infoBoxes (或valueBoxes，我并不在乎)，但它似乎不起作用.

这是基于Rstudio上的shinydashbaord教程(我的教程使用infoBoxOutputs，但我想这里的格式并不重要)的代码的有效简化版本：

ui <- dashboardPage(
  dashboardHeader(title = "Info boxes"),
  dashboardSidebar(),
  dashboardBody(
    # infoBoxes with fill=FALSE
    fluidRow(
      infoBox("1st", 10 * 2, icon = icon("credit-card")),
      infoBox("2nd", 10 * 2, icon = icon("credit-card")),
      infoBox("3rd", 10 * 2, icon = icon("credit-card")),
    )
  )
)

它在同一行中显示3 infoBoxes。然而，一旦我再添加一个infoBox，它将移动到一个新行：

ui <- dashboardPage(
  dashboardHeader(title = "Info boxes"),
  dashboardSidebar(),
  dashboardBody(
    # infoBoxes with fill=FALSE
    fluidRow(
      infoBox("1st", 10 * 2, icon = icon("credit-card")),
      infoBox("2nd", 10 * 2, icon = icon("credit-card")),
      infoBox("3rd", 10 * 2, icon = icon("credit-card")),
      infoBox("4th", 10 * 2, icon = icon("credit-card")),
    )
  )
)

我还尝试使用列--然后在同一行上显示这些框，但是被扭曲了。

有什么想法吗？

Answer 1

很明显这就是我要找的：

在server.R:设置宽度=3的值框：

output$infoBox1 <- renderValueBox({..., valueBox(...,width = 3)})

在UI.R: put 4列与valueBoxOutputs，以这种方式：

column( 3,valueBoxOutput("infoBox1", width = 12))

Answer 2

在来自fluidRow的shiny中，我们知道它的最大列宽为12。

查看一下infoxBox函数：

infoBox(title, value = NULL, subtitle = NULL,
  icon = shiny::icon("bar-chart"), color = "aqua", width = 4,
  href = NULL, fill = FALSE)
}

我们看到宽度的设置是width = 4。

要想在一行上安装您想要的4 infoBoxes，只需设置width = 3。

用于所有意图和目的的明确示例：

library(shiny)
library(shinydashboard)

server <- function(input, output) {
}

ui <- fluidPage(
  fluidRow(
    infoBox("test", value=1, width=3),
    infoBox("test", value=2, width=3),
    infoBox("test", value=3, width=3),
    infoBox("test", value=4, width=3)
  )
)

shinyApp(ui = ui, server = server)

屈服：

​

​

Answer 3

library(shiny)
library(shinydashboard)

server <- function(input, output) {
}

ui <- fluidPage(
  fluidPage(                      ##Change for fluidPage
     mainPanel(width = 12,        ##HERE 
      infoBox("test", value=1, width=3),
      infoBox("test", value=2, width=3),
      infoBox("test", value=3, width=3),
      infoBox("test", value=4, width=3)
  )
)

shinyApp(ui = ui, server = server)

这似乎对我有用。我的应用程序也有同样的问题。