R：你如何在 Shiny 中初始化数据表 FixedColumns javascript？答案

【问题标题】：R: How do you initialise datatables FixedColumns javascript in Shiny?R：你如何在 Shiny 中初始化数据表 FixedColumns javascript？
【发布时间】：2014-11-12 12:10:45
【问题描述】：

我正在尝试构建一个使用数据表 FixedColumns 插件的闪亮应用：

https://datatables.net/extensions/fixedcolumns/

我使用的数据集大约有 100 列，我想修复前五列并允许用户滚动浏览其余列。从示例看来，我需要使用这个 javascript：

https://datatables.net/release-datatables/extensions/FixedColumns/examples/two_columns.html

$(document).ready(function() {
    var table = $('#example').DataTable( {
        scrollY:        "300px",
        scrollX:        true,
        scrollCollapse: true,
        paging:         false
    } );
    new $.fn.dataTable.FixedColumns( table, {
        leftColumns: 2
    } );
} );

我不知道 javascript，但过去我可以使用 I() 插入 javascript 选项。这一次，虽然看起来我需要做点别的事情。我试过下面的代码并得到消息：“错误：'选项'必须是一个命名列表'。

library(shiny)
library(ggplot2)
data(diamonds)
hw <- diamonds

runApp(
  list(ui=(
    fluidPage(
      tabsetPanel(
        id = 'dataset',
        tabPanel('hw', dataTableOutput('mytable1'))
      ))),

    server = (function(input, output, session) {
      output$mytable1 <- renderDataTable(
        head(hw, 50), 
        options = list(scrollY = '300px',
                       scrollX = TRUE,
                       scrollCollapse = TRUE,
                       paging = FALSE,

                       I("new $.fn.dataTable.FixedColumns( table, {
                        leftColumns: 5
                        } );")
                       ))


    })

  ))

【问题讨论】：

我有同样的问题/问题。到目前为止，我还没有找到关于如何在任何地方执行此操作/示例的明确说明。

标签： javascript r datatables shiny

【解决方案1】：

如果最近有人遇到这个问题，您现在可以直接使用 FixedColumns 扩展，无需任何 javascript：

https://rstudio.github.io/DT/extensions.html

m = as.data.frame(round(matrix(rnorm(100), 5), 5))
datatable(
  m, extensions = 'FixedColumns',
  options = list(
    dom = 't',
    scrollX = TRUE,
    fixedColumns = TRUE
  )
)

【讨论】：

【解决方案2】：

list(tags$head(tags$script('type = "text/javascript"', '
        $(document).ready( function () {
            var table = $("#example").DataTable( {
                "scrollY": "300px",
                "scrollX": "100%",
                "scrollCollapse": true,
                "paging": false
            } );
            new $.fn.dataTable.FixedColumns( table );
        } );
')))

【讨论】：