如何在 R Shiny 数据表中设置列宽？答案

【问题标题】：How to set column width in R Shiny data table?如何在 R Shiny 数据表中设置列宽？
【发布时间】：2019-08-08 01:59:28
【问题描述】：

我正在构建一个显示数据表的闪亮仪表板。

我的目标是自动调整数据表的列宽以适应 1 行而不是多行中的单元格值。但是，我得到了以下结果：

似乎 Name 已按我的要求进行了调整，但 Notes 没有。然后，我点击了这些链接： https://rstudio.github.io/DT/options.html,

Setting column width in R Shiny DataTable does not work in case of lots of column,

R Shiny set DataTable column width

基本上，网上建议的解决方案是在渲染数据表时使用autoWidth = TRUE参数和columnDefs。

这对我也不起作用，结果如下：

与最初的结果相比，表格的宽度似乎变窄了

下面是我的最终代码：

header <- dashboardHeader(
  title = "Test"
)

sidebar <- dashboardSidebar(
)

body <- dashboardBody(
            box(title = "Test", width = 7, status = "warning", DT::dataTableOutput("df"))
)

# UI
ui <- dashboardPage(header, sidebar, body)

# Server
server <- function(input, output, session) {

  output$df = DT::renderDataTable(df, options = list(
    autoWidth = TRUE,
    columnDefs = list(list(width = '10px', targets = c(1,3)))))
    }

# Shiny dashboard
shiny::shinyApp(ui, server)

我不知道为什么Name列的宽度可以随着单元格值的长度调整，而Notes不能。我也试过在其他项目中使用数据表，列的宽度只能用列名的长度来调整。

在我的情况下，另一个选项是将列宽设置为只有一定数量的字符，并通过将鼠标悬停在单元格上显示单元格值的完整上下文。此处提出了解决方案：R Shiny Dashboard DataTable Column Width。但是，这只是针对 DT 的，但是当我将它集成到 Shiny 中时，它并没有成功。

提前致谢。

【问题讨论】：

“不过，这只是DT的，但是我在Shiny中集成的时候就不行了。”我不这么认为。我给的答案@ 987654327@ 也应该在 Shiny 中工作。

标签： javascript html r shiny rstudio

【解决方案1】：

问题在于列宽的索引是以 0 为底，而不是 1。在 OP 代码中，目标设置了第 2 列和第 4 列的宽度（相对较窄的 10px），而不是 1 和 3。

试试下面的，

columnDefs = list(list(width = '200px', targets = c(0,2)))))

这应该使第一列和第三列成为 200 像素，而所有其他列都是自动宽度。

【讨论】：

【解决方案2】：

如果您不想要多行，可以将 CSS 属性 white-space: nowrap 添加到您想要的列中的单元格中。

由于您在 Shiny 中，因此很容易做到这一点，只需定义一个 CSS 类并将其分配给 columnDefs 选项中带有 className 的列：

library(DT)
library(shiny)

dat <- data.frame(
  V1 = c("A", "B"),
  V2 = c(
    "A cool guy living in US and Canada", 
    "A cool guy living in California"
  ),
  V3 = c(
    "A cool guy living in US and Canada", 
    "A cool guy living in California"
  ),
  V4 = c(
    "A cool guy living in US and Canada", 
    "A cool guy living in California"
  ),
  V5 = c(
    "A cool guy living in US and Canada", 
    "A cool guy living in California"
  ),
  stringsAsFactors = FALSE
)

css <- "
.nowrap {
  white-space: nowrap;
}"

ui <- fluidPage(
  tags$head(
    tags$style(HTML(css))
  ),
  DTOutput("table")
)

server <- function(input, output){

  output[["table"]] <- renderDT({
    datatable(dat, 
              options = list(
                columnDefs = list(
                  list(className = "nowrap", targets = "_all")
                )
              ))
  })
}

shinyApp(ui, server)

【讨论】：