R Shiny：renderUI中的表条件格式

在另一篇文章中 ，假设该表不是renderUI函数的一部分，则回答了同样的问题。

在下面的例子中，我试图调整相同的解决方案（使用JQuery），其中我想条件格式化的表属于renderUI函数。

library(shiny) library(datasets) script  50) { $(this).css('background-color', '#0c0'); } else if (cellValue <= 50) { $(this).css('background-color', '#f00'); } })" shinyServer(function(input, output, session) { session$onFlushed(function() { session$sendCustomMessage(type='jsCode', list(value = script)) }) output$view <- renderTable({ head(rock, n = 20) }) output$Test1 <- renderUI({ list( tags$head(tags$script(HTML('Shiny.addCustomMessageHandler("jsCode", function(message) { eval(message.value); });'))), tableOutput("view") ) }) }) shinyUI(fluidPage( tabsetPanel( tabPanel("Test1",uiOutput("Test1")), tabPanel("Test2") ) )) 

在这个小例子中，条件格式化不适用于表格

Answer 1

将你的调用更改为session$onFlushed ，每次shiny刷新被动系统时，通过添加参数once = FALSE调用你的函数once = FALSE ：

  session$onFlushed(function() { session$sendCustomMessage(type='jsCode', list(value = script)) }, once = FALSE) 

在一个自包含的例子中：

 library(shiny) library(datasets) script <- "$('tbody tr td:nth-child(5)').each(function() { var cellValue = $(this).text(); if (cellValue > 50) { $(this).css('background-color', '#0c0'); } else if (cellValue <= 50) { $(this).css('background-color', '#f00'); } })" runApp(list(server = function(input, output, session) { session$onFlushed(function() { session$sendCustomMessage(type='jsCode', list(value = script)) }, FALSE) output$view <- renderTable({ head(rock, n = 20) }) output$Test1 <- renderUI({ list( tags$head(tags$script(HTML('Shiny.addCustomMessageHandler("jsCode", function(message) { eval(message.value); });'))) , tableOutput("view") ) }) } , ui = fluidPage( tabsetPanel( tabPanel("Test1",uiOutput("Test1")), tabPanel("Test2") ) )) ) 

Answer 2

谢谢，jdharrison – 这很完美。

我借用这个jQuery线程 ，稍微扩展了该方法，根据预定义的最小值和最大值创建单元格的渐变着色（例如数据表热图）。 希望这种修改可能对某人有所帮助。

使用您自包含的示例：

 library(shiny) library(datasets) script <- " // Set min and max for gradient var min = 0; var max = 100; var n = max-min // Define the min colour, which is white xr = 255; // Red value xg = 255; // Green value xb = 255; // Blue value // Define the max colour #2ca25f yr = 44; // Red value yg = 162; // Green value yb = 95; // Blue value $('tbody tr td:nth-child(5)').each(function() { var val = parseInt($(this).text()); // Catch exceptions outside of range if (val > max) { var val = max; } else if (val < min) { var val = min; } // Find value's position relative to range var pos = ((val-min) / (n-1)); // Generate RGB code red = parseInt((xr + (( pos * (yr - xr)))).toFixed(0)); green = parseInt((xg + (( pos * (yg - xg)))).toFixed(0)); blue = parseInt((xb + (( pos * (yb - xb)))).toFixed(0)); clr = 'rgb('+red+','+green+','+blue+')'; // Apply to cell $(this).css('background-color', clr); })" runApp(list(server = function(input, output, session) { session$onFlushed(function() { session$sendCustomMessage(type='jsCode', list(value = script)) }, FALSE) output$view <- renderTable({ head(rock, n = 20) }) output$Test1 <- renderUI({ list( tags$head(tags$script(HTML('Shiny.addCustomMessageHandler("jsCode", function(message) { eval(message.value); });'))) , tableOutput("view") ) }) } , ui = fluidPage( tabsetPanel( tabPanel("Test1",uiOutput("Test1")), tabPanel("Test2") ) )) ) 

产量