【发布时间】：2021-08-31 16:23:35
【问题描述】：
我有 2 个带有自定义颜色的值框，我想自定义它们在行中占用的空间（宽度）。但是，R 忽略了来自 shinydashboard 的 valueBox() 命令中的宽度参数，我认为这是因为我将它包装在标签中以更改颜色。
我试图通过将输出包装在 fluidRow() 中然后指定列宽来解决这个限制，但这会产生下面奇怪的输出（见屏幕截图）。
在不删除关于颜色的代码的情况下，如何指定每个单独值框的宽度？
library(shinydashboard)
library(shiny)
library(dplyr)
navy_inner_box <- "#total_fails .inner{ background-color: navy};"
yellow_inner_box <- "#total_perfect .inner , p , h3 { background-color: yellow};"
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
textInput(inputId = "greeting",
label = "Say hi!"),
actionButton(inputId = "submit",
label = "Submit")
),
mainPanel(
fluidRow(
tags$style(yellow_inner_box),
tags$style(navy_inner_box),
column(6, valueBoxOutput("total_perfect")),
column(9, valueBoxOutput("total_fails"))
))
))
server <- function(input, output) {
data <- tibble(name = c("Justin", "Corey", "Sibley"),
grade = c(50, 100, 100))
output$total_perfect <- renderValueBox({
shiny::req(input$greeting)
shiny::req(input$submit)
if(input$greeting == "hi!") {
num_100s <- data %>% filter(grade == 100) %>% nrow()
valueBox(value = tags$p(num_100s, style = "text-align:center;color: #FFFFFF; background-color: red"),
subtitle = tags$p("Number of Perfect Scores", style = "text-align:center;color: #FFFFFF; background-color: red")) }
})
output$total_fails <- renderValueBox({
shiny::req(input$greeting)
shiny::req(input$submit)
if(input$greeting == "hi!") {
num_50s <- data %>% filter(grade == 50) %>% nrow()
valueBox(value = tags$p(num_50s, style = "text-align:center;color: #FFFFFF; background-color: navy"),
subtitle = tags$p("Number of Total Failures", style = "text-align:center;color: #FFFFFF; background-color: navy"))}
})
}
shinyApp(ui, server)
R 阅读我的专栏规范的奇异方式的可视化。此外，有时它也会切断信息。
编辑：
在我尝试使用的第一个评论和代码时添加屏幕截图：
library(shinydashboard)
library(shiny)
library(dplyr)
navy_inner_box <- "#total_fails .inner{ background-color: navy};"
yellow_inner_box <- "#total_perfect .inner , p , h3 { background-color: yellow};"
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
textInput(inputId = "greeting",
label = "Say hi!"),
actionButton(inputId = "submit",
label = "Submit")
),
mainPanel(
tags$style(yellow_inner_box),
tags$style(navy_inner_box),
fluidRow(column(6), column(3, valueBoxOutput("total_perfect")), column(3)),
fluidRow(column(9, valueBoxOutput("total_fails")), column(3))
))
)
server <- function(input, output) {
data <- tibble(name = c("Justin", "Corey", "Sibley"),
grade = c(50, 100, 100))
output$total_perfect <- renderValueBox({
shiny::req(input$greeting)
shiny::req(input$submit)
if(input$greeting == "hi!") {
num_100s <- data %>% filter(grade == 100) %>% nrow()
valueBox(value = tags$p(num_100s, style = "text-align:center;color: #FFFFFF; background-color: red"),
subtitle = tags$p("Number of Perfect Scores", style = "text-align:center;color: #FFFFFF; background-color: red")) }
})
output$total_fails <- renderValueBox({
shiny::req(input$greeting)
shiny::req(input$submit)
if(input$greeting == "hi!") {
num_50s <- data %>% filter(grade == 50) %>% nrow()
valueBox(value = tags$p(num_50s, style = "text-align:center;color: #FFFFFF; background-color: navy"),
subtitle = tags$p("Number of Total Failures", style = "text-align:center;color: #FFFFFF; background-color: navy"))}
})
}
shinyApp(ui, server)
【问题讨论】：
-
你能澄清你想要什么吗？这看起来按预期工作。我在想也许你想把价值框放在中心？您可以通过将它们包装在像
fluidRow(column(3),column(6,valueBoxOutput()),column(3))? 这样的空白列中来做到这一点。如果有帮助，每行中的列总数应加起来为 12。 -
@Baroque，由于某种原因，它的显示不一致。另外，我尝试了你的建议，因为盒子的弯曲也很困难。但是，当我尝试您建议的代码时，它看起来像上面那样。当我只调用流体行时，它也会切割大部分的盒子。
-
我签出了
?valueBox，因为我从未使用过这些东西（还），它说“值框应该放在仪表板的主体中。”这个问题可能是因为您将它们放置在标准闪亮的应用程序中，而不是dashboardPage(dashboardBody(... valueBoxOutput()...))格式。查看此页面以了解有关shinydashboardUI 格式的更多信息：rstudio.github.io/shinydashboard/get_started.html -
@Baroque，感谢您的帮助。没错，但我刚刚发现使用来自 shinyWidgets 包的函数的 useShinydashboard() 可以在严格的 shinydashboard 结构之外无缝使用值框。如果有兴趣，请参阅我在下面发布的答案。再次感谢您的帮助！
标签： css r shiny reactive-programming shinydashboard