在 Shiny 中使用 data.table 冻结标题和第一列 [英] Freezing header and first column using data.table in Shiny

问题描述

我有一个 Shiny 应用程序可以生成一个数据表，但我无法冻结第一列和标题，因此当您向下或穿过时很难阅读该表.无论如何要冻结窗格吗?我已经尝试过搜索，但一无所获.

I have a Shiny app that yields a data table, but I can't freeze the first column and the headers, so the table is hard to read as you go down or across. Is there anyway to freeze the panes? I've tried searching but have found nothing.

推荐答案

有趣的问题，感谢 Shiny 最近更新到 data.tables 1.10.2使用各种插件和扩展要容易得多.对于您的问题，FixedHeader 扩展似乎很理想.要添加这个扩展，我们需要包含相关的 JavaScript 和 CSS 文件(参见 http://cdn.datatables.net/):

Interesting question and now thanks to the recent update of Shiny to data.tables 1.10.2 it is alot easier to use the various plug-ins and extensions. For your question the FixedHeader extension seems ideal. To add this extension we need to include the relevant JavaScript and CSS file (see http://cdn.datatables.net/):

tagList(
  singleton(tags$head(tags$script(src='//cdn.datatables.net/fixedheader/2.1.2/js/dataTables.fixedHeader.min.js',type='text/javascript'))),
  singleton(tags$head(tags$link(href='//cdn.datatables.net/fixedheader/2.1.2/css/dataTables.fixedHeader.css',rel='stylesheet',type='text/css')))
)

data.tables 有一个选项 initComplete 允许我们在绘制表格后规定回调等.

data.tables has an option initComplete which allows us to stipulate a callback once table is drawn etc.

function(settings, json) {
     new $.fn.dataTable.FixedHeader(this, {
                                            left:   true,
                                            right:  true
                                          } );
                                        }

我们将使用 iris 数据集的修改版本，在末尾添加索引和一些随机数据以显示从左到右的滚动:

We will use a modified version of the iris data set adding an index and some random data at the end to show left to right scrolling:

library(shiny)
myData <- cbind(list(index = row.names(iris)), iris
                , rep(list(row.names(iris)), 10))
names(myData)[7:16] <- paste0("randomData", 1:10)
runApp(
  list(ui = fluidPage(
    tagList(
      singleton(tags$head(tags$script(src='//cdn.datatables.net/fixedheader/2.1.2/js/dataTables.fixedHeader.min.js',type='text/javascript'))),
      singleton(tags$head(tags$link(href='//cdn.datatables.net/fixedheader/2.1.2/css/dataTables.fixedHeader.css',rel='stylesheet',type='text/css')))
    ), 

    dataTableOutput("mytable")
  )
  , server = function(input, output, session){
    output$mytable <- renderDataTable(myData,
                                      options = list(
                                        pageLength = 50,
                                        initComplete = I("function(settings, json){
                                          new $.fn.dataTable.FixedHeader(this, {
                                            left:   true,
                                            right:  true
                                          } );
                                        }")
                                      )
    )
  })
)

所以在图像中我们可以看到我们向下滚动到记录 8 并跨越某些方式，但标题和第一列(我们添加的索引列)仍然可见.

so in the image we can see we are scrolled down to record 8 and across some ways but the header and the first column (our added index column) are still visible.

这篇关于在 Shiny 中使用 data.table 冻结标题和第一列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！