控制数据表输出中的行条纹颜色

Question

在数据表 (DT) 中设置自定义行条纹/行条纹颜色的“最佳”方法是什么？

我正在使用数据表 (DT) 创建交互式表格（例如通过 rmarkdown 的 HTML），具有下载功能等。这就是为什么我不使用 Huxtable 或任何其他表格格式包，理想情况下我不必设置样式在将其发送到数据表之前，首先将表放在另一个包中 - 尽管如有必要/最佳可用选项对此开放。

这是一个独立的行条带化示例，根据此处显示的示例进行修改，answer#1 ( https://src-bin.com/en/q/1b3261f )，类似于此不成功的尝试。一个问题是悬停颜色不再有效，尽管它是应用于任何存在的颜色？另一个是行颜色在按列重新排序后保持原始行数据 - 不确定这种默认行为是否是我想要的 - 是否容易更改？

  DT::datatable(head(iris, 20),
                extensions = 'Buttons',
                options=list(dom = 'Bfrtip',
                             buttons = c('excel','csv','print'),
                             rowCallback=JS(
                               'function(row,data) {
     if($(row)["0"]["_DT_RowIndex"] % 2 <1) 
            $(row).css("background","#f2f9ec")
   }'))) 

这里有一个选项可以按值为单元格的背景着色，这不是我所追求的： color-cells-in-dt-datatable-in-shiny

Datatables(dot)net datatables.net/manual/styling/theme-creator有一个示例样式表，它创建了一大堆 CSS（357 行代码），大概可以在 style.css 文件中使用它来执行所需的操作（行条纹，自定义颜色）？当我认为我的目的的秘诀就是这行代码（如下）时，这对我来说似乎有点过分了。请注意，数据表示例的默认行为具有独立于初始行号的条带化（参见上面的代码，条带化保留在原始原始数据中）。我可以将下面的代码直接放入 r 数据表代码中吗，例如上面的例子？

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {`
background-color` `: ` `#f9f9f9` `; }`

Answer 1

你可以做：

library(DT)

callback <- c(
  "$('table.dataTable.display tbody tr:odd').css('background-color', 'green');",
  "$('table.dataTable.display tbody tr:even').css('background-color', 'red');",
  "$('table.dataTable.display tbody tr:odd')",
  "  .hover(function(){",
  "    $(this).css('background-color', 'yellow');",
  "   }, function(){",
  "    $(this).css('background-color', 'green');",
  "   }",
  "  );",
  "$('table.dataTable.display tbody tr:even')",
  "  .hover(function(){",
  "    $(this).css('background-color', 'orange');",
  "   }, function(){",
  "    $(this).css('background-color', 'red');",
  "   }",
  "  );"
)

datatable(iris, callback = JS(callback))

编辑

以下是@Mark Neal 评论后的修复：

library(DT)

rowCallback <- c(
  "function(row, data, num, index){",
  "  var $row = $(row);",
  "  if($row.hasClass('even')){",
  "    $row.css('background-color', 'green');",
  "    $row.hover(function(){",
  "      $(this).css('background-color', 'yellow');",
  "     }, function(){",
  "      $(this).css('background-color', 'green');",
  "     }",
  "    );",  
  "  }else{",
  "    $row.css('background-color', 'cyan');",
  "    $row.hover(function(){",
  "      $(this).css('background-color', 'orange');",
  "     }, function(){",
  "      $(this).css('background-color', 'cyan');",
  "     }",
  "    );",  
  "  }",
  "}"  
)

datatable(iris, options = list(rowCallback = JS(rowCallback)))