r - 如何更改 Valuebox (flexdashboard) 中图标的颜色

Question

我正在 Rmd Flexdashboard(不是 Shiny)中创建 KPI，并希望根据规则更改 Valuebox 中图标的颜色:

• 如果值高于 0 则绿色箭头向上
• 如果值低于 0 红色向下箭头

我已经弄清楚了规则，但我不知道如何更改颜色(tags$i 不起作用)。非常感谢任何帮助。

valueBox(rule,  
         "Title + subtitle",
         icon = ifelse(rule >= 0, "fa-angle-up", "fa-angle-down"),
         color = "white")

Answer 1

迟到的答案，以防你还没有弄明白:

您可以使用 css 来改变颜色。创建一个 .css 文件。您可能必须将其保存在同一目录中名为 www 的文件夹中。更多信息在这里:https://shiny.rstudio.com/articles/css.html .我在我的例子中这样做了。如果您右键单击箭头并选择检查元素，您将找到所需样式的名称。在那里你可以测试不同的颜色。

你可以在上图中看到你想要的样式叫做.value-box .icon i。在图像的右上角，您可以看到图标的类型。然后，将此样式和您选择的颜色添加到新创建的 .css 中，如下所示:

/*arrow down*/
.value-box .icon i.fa.fa-angle-down{
    
    color: rgb(255, 0, 0); /*red*/
  
}
 
/*arrow up*/    
.value-box .icon i.fa.fa-angle-up{
  
    color: rgb(0, 153, 0); /*green*/
  
}

在标题中添加您的 .css 文件的路径:

---
title: "Untitled"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
    css: www/styles.css 

---

结果如下:

#arrow down
library(flexdashboard)
rule = -3
valueBox(rule,  
         "Title + subtitle",
         icon = ifelse(rule >= 0, "fa-angle-up", "fa-angle-down"),
         color = "white")

向上箭头:

library(flexdashboard)
rule = 3
valueBox(rule,  
         "Title + subtitle",
         icon = ifelse(rule >= 0, "fa-angle-up", "fa-angle-down"),
         color = "white")