从本地文件将 Uicons 添加到 Shiny

Question

希望将 uicons 添加到我的 Shiny 应用中。我在注册后下载了字体，并将 CSS 和 webfonts 移动到我的 .R 文件的根目录。（按照说明）现在我想在我的 infobox 中添加一个图标闪亮，我有一个很简单的例子

我想我可以使用某种 shiny::tags 但不确定是哪一种，或者如何使用。我使用 This Stackoverflow answer 来帮助指导我，

library(shiny)
library(shinydashboard)


ui <- dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody(
        tags$i("@import url(/css/uicons-regular-rounded.css);"),
        icon("fi fi-rr-camera")
        ))

server <- function(input, output) { }

shinyApp(ui, server)

这给了我这个

任何帮助将不胜感激。谢谢。

Answer 1

您需要将包括 svg 文件夹在内的所有文件夹放入闪亮应用根目录的 www 文件夹中。然后您可以使用 tags$img(src='svg/fi-rr-camera.svg')

导入图标

要在信息框中使用它，只需用 tags$i 包裹它。

library(shiny)
library(shinydashboard)


ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    tags$img(src='svg/fi-rr-camera.svg', height='40', width='40')
    infoBox("info","info",icon = tags$i(tags$img(src='svg/fi-rr-camera.svg', height='40', width='40')))
  ))

server <- function(input, output) { }

shinyApp(ui, server)

Answer 2

正如@phago29 所提到的，uicons-regular-rounded.css 需要位于项目目录（或仅使用 setwd() 的目录）内的子目录中。

 library(shiny)
library(shinydashboard)


ui <- dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody(includeCSS('www/uicons-regular-rounded.css'),
                  
                  tags$i(class = "fi fi-rr-camera")))


server <- function(input, output) { }

shinyApp(ui, server)

可重现的例子：

library(shiny)
library(shinydashboard)


ui <- dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody(includeCSS('https://fonts.googleapis.com/icon?family=Material+Icons'),

        tags$i(class = "material-icons", "accessibility", style = "font-size: 6em;")))


server <- function(input, output) { }

shinyApp(ui, server)