R : Add CSS color coding in a HTML table

Question

I need to export a data.frame to HTML file and color the backgroud of the table cell based a criteria.

Sample data.frame :

Name   Low    High    Value1    Value2    Value3
 Ben    3      10       2         5          8
 Cat    3      10       3         9          4
 Dan    3      10       5         7          6

Desire output is like :

enter image description here

I used below codes to generate the HTML, thank you for the help

HTMLheaderText ="Sample Report"
HTMLfile =HTMLInitFile(outdir     = getwd()
                   , filename = "sample"
                   , extension  = "html"
                   , Title      = "R Output"
                   , CSSFile    = paste(getwd(), "/html_tables.css", sep="")
                   , HTMLframe  = FALSE
                   , useGrid    = FALSE
                   , useLaTeX   = FALSE)

 HTML(HTMLheaderText, file = HTMLfile)
 HTML(dataSet, row.names = FALSE)
 HTMLEndFile()

possible duplicate of [R, knitr, xtable, alternating row colors](http://stackoverflow.com/questions/16579562/r-knitr-xtable-alternating-row-colors) — RockScience, Mar 24 '14 at 08:21
possible duplicate of (or, at least possibly answered by) [Create tables with conditional formatting with RMarkdown + knitr](http://stackoverflow.com/questions/15403903/create-tables-with-conditional-formatting-with-rmarkdown-knitr) — hrbrmstr, Mar 24 '14 at 11:30
Thanks all for the suggestions, but I am looking for something that could format the data by cell not by row. If the suggested links/functions has the capability to do this, please guide me. I am very new to R. Thank you. — Ianthe, Mar 25 '14 at 01:29

score 1 · Accepted Answer · answered Mar 31 '14 at 09:14

I found a solution to what I need though this may not be the best way to do it. I added a span in each cell and use jquery to dynamically change the background of the cell.

HTMLheaderText = "Sample Report"

HTMLfile =HTMLInitFile(outdir     = getwd()
                   , filename = "sample"
                   , extension  = "html"
                   , Title      = "R Output"
                   , CSSFile    = paste(getwd(), "/html_tables.css", sep="")
                   , HTMLframe  = FALSE
                   , useGrid    = TRUE
                   , useLaTeX   = FALSE)

HTML('<script src="./jquery-1.7.2.min.js"></script>', file = HTMLfile)

HTML("<script>
  $(document ).ready(function() { 
   $('.dataframe tr).each(function() { 
    var low = $(this).find('td>span.low').text(); 
    var high = $(this).find('td>span.high').text();
    $(this).find('td>span.value').each(function() {
      $(this).css('color', 'white');
      var value= $(this).text(); 
        if (value> low && value< high) {
          $(this).parent().css('background-color', 'green');
        } else {
          $(this).parent().css('background-color', 'red');
        }
         cpk = Number(Math.round(cpk+'e'+4)+'e-'+4);;
         $(this).text(value);
    });

  })
 });
 </script>", file = HTMLfile)

 HTML(HTMLheaderText, file = HTMLfile)
 HTML(dataSet, row.names = FALSE, digit=5)
 HTMLEndFile()

R : Add CSS color coding in a HTML table

1 Answers1