r - 如何更改 DT/Shiny 中 ColumnVisibility 按钮的颜色

Question

我正在使用 Shiny Dashboard 中的 DT 包构建一个表。该表有多个列，我使用 DT 的 ColVis 功能允许用户仅隐藏/显示他们感兴趣的列。

我的问题是 - 是否可以在单击“列可见性”按钮后更改这些按钮的颜色？截至目前，颜色差异还不够大，如果不导航到表格，很难分辨哪些列可见，哪些不可见。我附上了一个屏幕截图来说明我的意思。 The Site_ID column is not visible in the table, while the Participant_ID column is.

我使用谷歌浏览器中的 inspect element 来找出对象名称，它看起来是:a.dt-buttons.buttons-columnVisibility，并且在 body.skin-blue、div.dt-button-collection 下。

使用此信息，我将以下行添加到我的 ui.R 代码中:

tags$head(tags$style(HTML(".skin-blue .dt-button-collection .buttons-columnVisibility .active a{background-color: #4d4d4d}")))

但这似乎没有做任何事情。任何有关将此自定义 CSS/HTML 实现到我的仪表板的帮助都将不胜感激。

Answer 1

基于 this answer , 看起来按钮颜色需要用 background 设置。我还使用了 !important 来覆盖 DT 按钮样式，尽管这 may not be the best practice .

这是一个小的工作示例:

library(DT)
library(shiny)

ui <- basicPage(
    tags$head(
        tags$style(
        HTML(
            ".dt-button.buttons-columnVisibility {
              background: #FF0000 !important;
              color: white !important;
              opacity: 0.5;
           }
        .dt-button.buttons-columnVisibility.active {
              background: black !important;
              color: white !important;
              opacity: 1;
           }"
             )
        )
        ),
    h2("The iris data"),
    DT::dataTableOutput("mytable")
)

server <- function(input, output) {
    output$mytable = DT::renderDataTable({
        datatable(
            iris, rownames = FALSE,
            extensions = 'Buttons', 
            options = list(dom = 'Bfrtip', buttons = I('colvis'))
        )
    })
}

shinyApp(ui, server)