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

Posted

技术标签:

【中文标题】更改 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

【讨论】:

以上是关于更改 R DataTables (DT) 中的字体大小的主要内容,如果未能解决你的问题,请参考以下文章

jQuery / DataTables:如何更改分页颜色

如何在 R 中的数据表 DT 中添加行边框和斑马条纹(行条纹)?

如何使用 rmarkdown 在 pdf 中呈现 DT::datatables?

jQuery DataTables:如何更改分页活动颜色?

提醒页码。关于 jQuery dataTables 页面更改事件

无效的 JSON - DataTables - Kubernetes 上的 R ShinyProxy