如何在 flexdashboard 中添加徽标？

Question

我正在尝试在 flexdashboard 中添加公司徽标。如官方页面所述，我们需要提供图像路径，我正在做与下面给出的相同的操作，但无法在仪表板中添加徽标。想知道如何在 flexdashboard 中引入 logo 以及如何在仪表板的顶部栏中添加自定义颜色。

---
title: "Dashboard"
output: 
  flexdashboard::flex_dashboard:
    logo: C:/Users/Gaurav/Desktop/Test/www/BoA1.png
    vertical_layout: scroll
    orientation: rows
    theme: cosmo
    runtime: shiny
---

flexdashboard 给出的是仪表板的屏幕截图，突出显示的是无法正常工作的徽标。

Answer 1

对于徽标，您可能需要调整图像大小（magick 包可以提供帮助），以使其尺寸正确：

\n\n

\n

徽标图像不会执行缩放，因此它应该完全适合导航栏的尺寸（默认 \xe2\x80\x9ccosmo\xe2\x80\x9d 主题为 48 像素高，其他主题的导航栏可能略有不同高度）

\n

\n\n

https://rmarkdown.rstudio.com/flexdashboard/using.html#logo__favicon

\n\n

对于导航栏颜色，您需要使用 css 文件自定义外观。\n请参阅https://rmarkdown.rstudio.com/flexdashboard/using.html#css_styles

\n\n

\n

如果您想自定义这些颜色，您应该创建一个包含必需的 navbar-inverse 条目的 CSS 样式表，并使用 flex_dashboard 格式的 css 选项包含它。

\n

\n\n

\n
• custom.css添加自定义 css
\n

\n\n

.navbar-inverse {\n   background-color: <your color>;\n}\n

\n\n

\n
• 将此 css 文件包含在 yaml 标头中
\n

\n\n

title: "Custom CSS"\noutput: \n  flexdashboard::flex_dashboard:\n    css: custom.css\n

\n