将 input$ 值传递给闪亮数据表中的 JS() 语句

Question

使用此代码格式化我的数据表中的行

 rowCallback = DT::JS(
      'function(row, data) {
        // Bold cells for those >= 5 in the first column
        if (parseFloat(data[0]) >= 5.0)
          $("td", row).css("background", "red");
      }'
    )

我想更改此代码，以便突出显示基于 input$ 值而不是静态“5.0”值。这样用户就可以点击图表上的一个点，具有该值的行将在数据表中突出显示。

但是用 input$click 代替 5 似乎不起作用。想法？

rowCallback = DT::JS(
          'function(row, data) {
            // Bold cells for those >= 5 in the first column
            if (parseFloat(data[0]) >= input$click)
              $("td", row).css("background", "red");
          }'
        )

Answer 1

使用最新版本的 DT，您无需任何 Javascript 即可使用formatStyle。

这是一个例子：

library(shiny)
library(DT)
shinyApp(
        ui = fluidPage(numericInput("cutoff", "Test", 5, min = 0, max = 10, step = 1),
                       DT::dataTableOutput('tbl')
        ),
        server = function(input, output) {
                output$tbl = DT::renderDataTable(
                        datatable(iris, options = list(lengthChange = FALSE)) %>% formatStyle(
                                'Sepal.Length',
                                target = 'row',
                                backgroundColor = styleInterval(input$cutoff, c('gray', 'yellow'))
                        )
                )
        }
)

更多信息和示例here 和here。

您可能需要通过运行以下命令安装 DT 的开发版本：

devtools::install_github('rstudio/DT')

如果你不能使用开发版的DT，这里还有一个解决办法：

library(shiny)
library(DT)
shinyApp(
        ui = fluidPage(numericInput("cutoff", "Test", 5, min = 0, max = 10, step = 1),
                       uiOutput("tbl_holder")

        ),
        server = function(input, output) {
                output$tbl_holder <- renderUI({
                        DT::dataTableOutput('tbl')
                })

                output$tbl = DT::renderDataTable(
                        datatable(iris, options = list(lengthChange = FALSE,rowCallback = DT::JS(
                                paste0('function(row, data) {
                                // Bold cells for those >= 5 in the first column
                                if (parseFloat(data[0]) >=',input$cutoff,')
                                $("td", row).css("background", "red");
        }')
        )))) 
        }
)

您可以使用paste在JS函数中添加cutoff，renderUi/uiOutput这样打印数据表的函数会在每次cutoff改变时更新。