DT :: datatable的背景颜色有光泽

时间:2015-11-17 13:48:31

标签: shiny dt

如何在闪亮的应用程序中更改数据表的选定行的背景颜色?我的ui.R有以下代码:

library(shinydashboard)

header <- dashboardHeader(title = 'title')
sidebar <- dashboardSidebar(
  sidebarMenu(
    menuItem('dashboard', tabName = 'dashboard', icon = icon('dashboard'))
  )
)
body <- dashboardBody(
  fluidRow(
    column(width = 6,
           box(
             title = 'box', width = NULL, status = 'primary',
             DT::dataTableOutput('table1')
           ),
           box(
             title = 'box', width = NULL, status = 'primary',
             DT::dataTableOutput('table2')
           )
    ),
    column(width = 6,
           box(
             title = 'box', width = NULL, status = 'primary',
             DT::dataTableOutput('table3')
           )
    )
  )
)
dashboardPage(header, sidebar, body)

1 个答案:

答案 0 :(得分:3)

您可以使用CSS执行此操作。所选行的颜色由table.dataTable tbody tr.selected { background-color: #B0BED9;}中的jquery.min.dataTables.css设置。

以下是基于您的代码的最小示例,了解如何使用tags$style覆盖它:

library(shinydashboard)

header <- dashboardHeader(title = 'title')
sidebar <- dashboardSidebar(
  sidebarMenu(
    menuItem('dashboard', tabName = 'dashboard', icon = icon('dashboard'))
  )
)
body <- dashboardBody(
  tags$head(tags$style(HTML("#table1 tr.selected, #table2 tr.selected {background-color:red}"))),
  fluidRow(
    column(width = 6,
           box(
             title = 'box', width = NULL, status = 'primary',
             DT::dataTableOutput('table1')
           ),
           box(
             title = 'box', width = NULL, status = 'primary',
             DT::dataTableOutput('table2')
           )
    )
  )
)
ui<-dashboardPage(header, sidebar, body)

server = function(input, output) {
  output$table1 = DT::renderDataTable(
    iris, options = list(lengthChange = FALSE)
  )

  output$table2 = DT::renderDataTable(
    iris, options = list(lengthChange = FALSE)
  )
}

shinyApp(ui,server)

我添加了表格ID(#table1 tr.selected, #table2 tr.selected),以便此选择器的权重大于默认值,并覆盖它,有关此here的更多信息。