更改 R DataTables (DT) 中的字体大小

Posted 2023-02-14

【中文标题】更改 R DataTables (DT) 中的字体大小

【英文标题】：changing font size in R DataTables (DT)

【发布时间】：2017-10-21 09:56:28

【问题描述】：

一直在尝试更改 DT 生成的表格中所有文本的字体大小。但是，我只能弄清楚如何使用 formatStyle(names(datCalc), fontSize = '12px')。 列标题和按钮具有相同大小的文本。在 RStudio 中使用 R Markdown。

【问题讨论】：

由于生成的小部件由 html 组成，因此您可以使用 CSS。最实用的方法取决于上下文。一种选择是通过 RMarkdown 标头包含一个样式表，其中包含足够具体的选择器以根据需要设置样式。

【参考方案1】：

基于 Antex 和 sabeepa 给出的答案。如果要更改所有内容的字体大小，包括表格本身之外的 DT 组件，请使用 table().container()。所以代码看起来像这样：

font.size <- "10pt"

df %>% 
   DT::datatable(
     options=list(
       initComplete = htmlwidgets::JS(
          "function(settings, json) ",
          paste0("$(this.api().table().container()).css('font-size': '", font.size, "');"),
          "")
       ) 
     )

【参考方案2】：

能够通过使用 JS 表格更改 CSS 和使用 formatStyle 的列内容字体大小来更改页眉和页脚，如下所示。但是，页眉和页脚字体大小保持不变。我想一口气更改页眉/页脚/正文（表格的整个字体）。这可能吗？

datatable(head(iris, 20), options = list(
  initComplete = JS(
    "function(settings, json) ",
    "$(this.api().table().header()).css('font-size': '5px', 'background-color': '#c2d1f0', 'color': '#fff');",
    ""))) %>%  formatStyle(columns = colnames(.$x$data), `font-size` = '12px')

尝试使用以下命令更新列的 CSS 没有成功

"$(this.api().columns().data()).css('font-size': '5px');"

"$(this.api().table().footer()).css('font-size': '10px);"

"$(this.api().tables().body()).css('font-size': '10px');"

【参考方案3】：

我想你快到了。我通过明确告诉DT::formatStyle() 我想要哪些列来解决它。我第一次尝试使用names() 或colnames() 方法，就像你做的那样。由于某种原因，这不起作用：

iris %>%
  DT::datatable() %>%
  DT::formatStyle(columns = colnames(.), fontSize = '50%')

但是，我们知道 iris 数据集有 5 列，所以我这样做了：

iris %>%
  DT::datatable() %>%
  DT::formatStyle(columns = c(1, 2, 3, 4, 5), fontSize = '50%')

在这种情况下，我使用font-size = 50%，但您也可以像以前一样指定font-size = 12pt。您还可以将 c(T, F, F, F, T) 等逻辑向量提供给 columns 参数，格式将应用于您已声明 TRUE 的那些列。

【讨论】：

colnames(.) 不起作用的原因是管道不返回 iris 但无论 DT::datatable() 返回什么（即列表）。如果你写 colnames(iris) 它就可以了。

这真的行不通；它只会改变表格内文本的字体大小，而不是整个表格。

【参考方案4】：

通过 javascript 表头调用添加 CSS 似乎可以解决问题（即 'this.api().table().header()' ）。

datatable(..., options=list(
  initComplete = JS(
        "function(settings, json) ",
        "$(this.api().table().header()).css('font-size': '50%');",
        "")))
  )

引用：第 4.3 节@https://rstudio.github.io/DT/options.html