Output a good-looking matrix using renderTable()

Question

I am creating a matrix in my server. I would like to then output this matrix on the screen using renderTable(). (I create it in the server because its length (among others) depends on some other inputs in the ui).

As you will see with the code (or the attached picture) here below, the matrix that appears does not look good at all:it's a matrix with grey borders, rounded corners etc.

So the question: is there a way to control the appearance of the matrix? For example, I may not want borders, I may want the rownames to be in Italics/bold etc...

shiny::runApp(
list(
ui = pageWithSidebar(

headerPanel("TEST"),

sidebarPanel(
helpText('This matrix is pretty ugly:')
),

mainPanel(    
uiOutput('matrix')     
)
)
, 
server = function(input,output){
output$matrix <- renderTable({

matrix <- matrix(rep(1,6),nrow=3)

rownames(matrix) <- c('a','b','c')
matrix

})
}
)
)

Answer 1

Mathjax rendering:

library(xtable)

shiny::runApp(
  list(
    ui = pageWithSidebar(

      headerPanel("TEST"),

      sidebarPanel(
        helpText('Is this matrix cool ?')
      ),

      mainPanel(    
        uiOutput('matrix')     
      )
    )
    , 
    server = function(input,output){
      output$matrix <- renderUI({
        M <- matrix(rep(1,6),nrow=3)
        rownames(M) <- c('a','b','c')
        M <- print(xtable(M, align=rep("c", ncol(M)+1)), 
                          floating=FALSE, tabular.environment="array", comment=FALSE, print.results=FALSE)
        html <- paste0("$$", M, "$$")
        list(
          tags$script(src = 'https://c328740.ssl.cf1.rackcdn.com/mathjax/2.0-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML', type = 'text/javascript'),
          HTML(html)
        )
      })
    }
  )
)

Update July 2015

Something has changed and the MathJax rendering does not work anymore. Maybe this is the link to the MathJax library, I don't know. Anyway, there's a new function in Shiny, withMathJax , which does the job. Replace the server function by the following one:

server = function(input,output){
    output$matrix <- renderUI({
        M <- matrix(rep(1,6),nrow=3)
        rownames(M) <- c('a','b','c')
        M <- print(xtable(M, align=rep("c", ncol(M)+1)), 
                   floating=FALSE, tabular.environment="array", comment=FALSE, print.results=FALSE)
        html <- paste0("$$", M, "$$")
        list(
            withMathJax(HTML(html))
        )
    })
}

Answer 2

You can start fiddling with CSS, but for quick work the googleVis package is nice. Additional options to add decorations can be found in the documentation.

shiny::runApp(
  list(
    ui = pageWithSidebar(

      headerPanel("TEST"),

      sidebarPanel(
        helpText('This matrix is quite nice:')
      ),

      mainPanel(    
        uiOutput('matrix')     
      )
    )
    , 
    server = function(input,output){
      library(googleVis)
      output$matrix <- renderGvis({
        df <- as.data.frame(matrix(rnorm(9),nrow=3))      
        rownames(df) <- c('a','b','c')
        gvisTable(df);

      })
    }
  )
)

Answer 3

For rownames in googleVis package use:

 shiny::runApp(
  list(
ui = pageWithSidebar(

  headerPanel("TEST"),

  sidebarPanel(
    helpText('This matrix is quite nice:')
  ),

  mainPanel(    
    uiOutput('matrix')     
  )
)  
, 
server = function(input,output){
  library(googleVis)
  output$matrix <- renderGvis({
    df <- as.data.frame(matrix(rnorm(9),nrow=3))      
    df <- cbind(' ' = c('a','b','c'),df) 
    gvisTable(df);

  })
}
  )
)