代码之家 › 专栏 › 技术社区 › HectorLector

R闪亮可渲染更改单元格颜色

shiny html-table r css javascript

HectorLector · 技术社区 · 7 年前

我有一张表,想根据x(=6)中的值(0-100)给每个单元格上色,不同的蓝色阴影。表格显示在选项卡面板中。

目前,我正在使用shinyjs调用一个javascript函数,该函数选择我的表并将css样式添加到 <td> 标记,具体取决于值范围。

问题是,在第一次加载表时(单击tabpanel),只有在重新加载后才会显示颜色。

因此,我要么在r中寻找解决方案(不需要额外的javascript),要么寻找自动重新加载表/选项卡面板的方法。

library(shiny)

ui <- shinyUI(fluidPage(
    tableOutput("dataTable")
  ))

server <- shinyServer(function(input, output) {

  output$dataTable <- renderTable({
    data <- getDataFromSomeWhere();
    //Some operations on data
    data
    //I want to color every table cell, depening on value (f.e. 0-5 = white, 10-20 = light blue ...)
  }, rownames = TRUE, colnames = TRUE)

shinyApp(ui = ui, server = server)

更新最后,我继续使用javascript解决方案,但使用了闪亮的特定js事件来获得所需的效果:

$(document).on("shiny:value", function(e) {
  if (e.name == "myComponent") {
    e.preventDefault();
    $('#myComponent').html(e.value);
    //color code etc.
}

1 回复 | 直到 7 年前

clemens 7 年前

你可以使用 tableHTML 创建表格并按条件设置其样式。

library(shiny)
library(tableHTML)

改变 ui 使用输出函数 表格HTML :

ui <- shinyUI(fluidPage(
  tableHTML_output("dataTable")
))

然后使用 render_tableHTML() 呈现在中生成的表。

您可以使用函数创建一个纯HTML表 tableHTML() . 然后你可以使用 add_css_conditional_column() 创建条件语句(在本例中 between )更改背景颜色(注意:您也可以使用其他css。我已经用过 #f6f6f6 而不是 white 在本例中,因为您在输出中看不到差异)

server <- shinyServer(function(input, output) {

  getDataFromSomeWhere <- reactive({
    mtcars
  })

  output$dataTable <- render_tableHTML({
    data <- getDataFromSomeWhere();
    # //Some operations on data
    data %>% 
      tableHTML(rownames = TRUE) %>% 
      add_css_conditional_column(conditional = 'between',
                                 between = c(0, 5),
                                 css = list(c('background-color'),
                                            c('#f6f6f6')),
                                 columns = 1:ncol(data)) %>% 
      add_css_conditional_column(conditional = 'between',
                                 between = c(10, 20),
                                 css = list(c('background-color'),
                                            c('lightblue')),
                                 columns = 1:ncol(data))

  })

})

最终结果是: