如何在R Shiny的DT数据表最后一列嵌入条形图？

直接上可运行的修改后代码，关键调整render=JS()部分适配需求：

library(shiny)
library(DT)

ui <- fluidPage(
  DTOutput("data_table")
)

server <- function(input, output) {
  # 替换成你的实际业务数据
  your_data <- data.frame(
    类别 = c("产品X", "产品Y", "产品Z", "产品W"),
    销量 = c(120, 90, 150, 80),
    满意度 = c(85, 70, 92, 65), # 最后一列，用于生成条形图的数值列
    stringsAsFactors = FALSE
  )
  
  output$data_table <- renderDT({
    datatable(
      your_data,
      options = list(
        columnDefs = list(
          list(
            targets = ncol(your_data) - 1, # 自动定位最后一列（DT列索引从0开始）
            render = JS(
              "function(data, type, row, meta) {
                if(type === 'display') {
                  // 根据你的数据范围调整宽度计算逻辑，示例中满意度为0-100
                  const barWidth = data; // 直接以数值作为百分比
                  // 自定义条形样式：背景色、高度、圆角可按需修改
                  return '<div style=\"background: #2196F3; height: 18px; width: ' + barWidth + '%; border-radius: 2px;\"></div>';
                }
                // 导出或非显示场景返回原始数值，不影响数据功能
                return data;
              }"
            )
          )
        )
      )
    )
  })
}

shinyApp(ui, server)

关键调整说明 #

• 列定位：targets = ncol(your_data) - 1 确保始终选中最后一列，无需手动修改索引，适配列数变化。
• JS渲染逻辑：
  • 仅在前端显示时渲染条形图，不影响数据导出、筛选等其他操作。
  • 条形宽度适配：如果最后一列是0-1的比例，改成const barWidth = data * 100;；如果是0-50的数值，改成const barWidth = (data/50)*100;，保证宽度在0-100%区间。
  • 样式自定义：直接修改div的style属性，比如更换背景色为#FF9800、调整高度为20px，快速修改条形外观。

内容的提问来源于stack exchange，提问作者Vicki Latham