修改 R 数据表中的标题高度以获得闪亮的仪表板

Question

我正在尝试收紧 R 中数据表标题的高度。我将标题作为 initComplete=JS() 参数的一部分引用。

下面是我的代码片段：

initComplete=JS("function(settings, json) {","$(this.api().table().header()).css({'text-align': 'center','font-size ': '95%', '高度': '10%'}),"}")

虽然这适用于文本对齐和字体大小部分，但无论我输入什么，标题高度都不会改变。我在这里遗漏了什么吗？任何帮助将非常感激

Answer 1

标题的高度与应用于单元格（

th

元素）的内边距（10px）有关。因此，您必须减少此填充以降低标头的高度。您可以使用一些 CSS 修改此填充，并在 JS 代码中调整高度（以 px 为单位）。

完整示例：

library(shiny)
library(DT)

ui <- {
  fluidPage(
    
    tags$head(

      tags$style(HTML("
   
      table.dataTable > thead > tr > th {
        background-color: black;
        color: white;
        padding: 0 10px !important;
      }
     "))
      ),
    
    fluidRow(
      column(6,
             DTOutput('table1')
      )
    )
  )
}

server <- function(input, output, session) {
  output$table1 <- renderDT({
    datatable(iris[, c('Species', 'Sepal.Length')],
              options = list(
                initComplete=JS("function(settings, json) {
                  $(this.api().table().header()).css({'text-align': 'center','font-size': '50%', 'height': '20px'})
                   }"
                  )
              )
    )
  })

}

shinyApp(ui, server)