解决shiny 中DT无法渲染sparkline样式

发布时间 2023-11-09 21:36:09作者: bio调参侠
library(shiny)
library(DT)
library(sparkline)
library(tidyverse)
data(iris)
library(htmlwidgets)

cb <- htmlwidgets::JS('function(){debugger;HTMLWidgets.staticRender();}')

ui <- fluidPage(
    htmlwidgets::getDependency('sparkline'),
    DTOutput("table")
)

server <- function(input, output) {
    test <- reactive({
        iris %>%
    group_by(Species) %>%
    summarise(n = n()) %>%
    mutate(spark = split(iris$Sepal.Length, iris$Species) %>%
        map(~ sparkline(.x, type = "bar")) %>%
        map(htmltools::as.tags) %>%
        map_chr(as.character))
    })

    output$table <- renderDataTable({
        datatable(test(),
        escape = FALSE,
        options = list(drawCallback=cb)
        )
    })
}

shinyApp(ui, server)

这段代码创建了一个Shiny应用,它使用DT(DataTables)表格来显示鸢尾花(iris)数据集的汇总信息,同时在每行中嵌入sparkline图表,显示不同物种(Species)的萼片长度(Sepal.Length)分布。

以下是代码的详细解释:

  1. 首先,加载了所需的R包:shinyDTsparklinetidyversehtmlwidgets。此外,使用data(iris)加载了鸢尾花数据集,以便在应用中使用。

  2. 创建了一个JavaScript回调函数cb,该函数将在表格绘制后调用,用于渲染sparkline图表。这个函数在应用中并没有直接使用,但可以在需要进行调试或自定义时使用。

  3. 在Shiny应用的UI部分,使用htmlwidgets::getDependency加载sparkline包所需的依赖项,包括相关的JavaScript和CSS资源。

  4. 在Server部分,首先创建了一个reactive函数test,用于处理数据并生成带有sparkline图表的汇总信息。在这个函数中,对鸢尾花数据集进行分组、汇总和sparkline图表的生成。map函数用于将sparkline图表应用于每个物种的萼片长度,将结果存储在名为spark的新列中。

  5. 使用renderDataTable函数来渲染数据表格。表格的数据源是通过调用test()获得的,即上一步中生成的带有sparkline图表的数据帧。escape参数设置为FALSE,以确保sparkline图表能够正常渲染。options参数中包含了drawCallback,这将在表格绘制后执行,用于确保sparkline图表正确渲染。