Creating interactive SVG tables in R

October 14, 2017
By

[This article was first published on R – Modern Data, and kindly contributed to R-bloggers]. (You can report issue about the content on this page here)
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.

In this post we will explore how to make SVG tables in R using plotly. The tables are visually appealing and can be modified on the fly using simple drag and drop. Make sure you install the latest version of Plotly i.e. v 4.7.1.9 from Github using devtools::install_github("ropensci/plotly)

The easiest way to create a SVG table in R using plotly is by manually specifying headers and individual cell values. The following code snippet highlights this:

#library(devtools)
#install_github("ropensci/plotly")

library(plotly)

p <- plot_ly(
  type = 'table',  # Specify type of plot as table
  
  # header is a list and every parameter shown below needs 
  # to be specified. Note that html tags can be used as well
  
  header = list(
    
    # First specify table headers
    # Note the enclosure within 'list'
    
    values = list(list('EXPENSES'),
                  list('Q1'),
                  list('Q2'), 
                  list('Q3'), 
                  list('Q4')),
    
    # Formatting 
    line = list(color = '#DFE8F3'),
    align = c('left','left','left','left','left'),
    font = list(color = c('#506784', '#506784', '#506784', '#506784', '#ab63fa'), size = 14)
  ),
  
  # Specify individual cells
  
  cells = list(
    
    # Now specify each cell content
    
    values = list(
      c('Salaries', 'Office', 'Merchandise', 'Legal', 'TOTAL'),
      c(1200000, 20000, 80000, 2000, 12120000),
      c(1300000, 20000, 70000, 2000, 130902000),
      c(1300000, 20000, 120000, 2000, 131222000),
      c(1400000, 20000, 90000, 2000, 14102000)),
    
    # Formatting
    line = list(color = '#DFE8F3'),
    align = c('left', 'left', 'left', 'left', 'left'),
    font = list(color = c('#506784', '#506784', '#506784', '#506784', '#ab63fa'), size = 14),
    height = 48
    )) %>% 
  
  # Layout is needed to remove gridlines, axis zero lines and ticktext 
  # or else they will also show up
  
  layout(xaxis = list(zeroline = F, showgrid = F, showticklabels = F, domain = c(0, 0.5)),
         yaxis = list(zeroline = F, showgrid = F, showticklabels = F))

p

We can also write a helper function to create these tables using dataframes.

library(plotly)

createTable <- function(df, tableHeight = 50){
  
  # Create the value parameters
  # Headers
  nms <- lapply(names(df), function(x){
    return(paste0("", x, ""))    
  })
  
  nms <- append(nms, "Rows", after = 0)
  headerValues <- lapply(nms, function(x){return(list(x))})
  
  # Cell values
  names(df) <- NULL
  cellValues <- apply(df, 2, function(x){return(list(x))})
  cellValues <- lapply(cellValues, function(x){return(unlist(x))})
  
  cellValues <- append(cellValues, list(rownames(df)), after = 0)
  
  # Create the list to pass to plot_ly()
  header <- list(
    values = headerValues, 
    
    # Formatting 
    line = list(color = '#DFE8F3'),
    align = c('left', rep('center', ncol(df))),
    font = list(color = '#ffffff', size = 16),
    fill = list(color = '#999999')
  )
  
  cells <- list(
    values = cellValues,
    
    # Formatting
    line = list(color = '#DFE8F3'),
    align = c('left', rep('right', ncol(df))),
    font = list(color = c('#262626'), size = 14),
    fill = list(color = c("#d9d9d9", rep("#ffe6cc", ncol(df)))),
    height = tableHeight
  )
  
  # Create table in plotly
  p <- plot_ly(
    type = "table",
    header = header,
    cells = cells,
    width = 1200, 
    height = 1600) %>% 
    
    layout(xaxis = list(zeroline = F, showgrid = F, showticklabels = F),
           yaxis = list(zeroline = F, showgrid = F, showticklabels = F))
  
  return(p)
}

p <- createTable(mtcars)
p

Note that columns can easily rearranged by dragging them around. You can find more information on individual attributes here
Hope this post was useful – happy table making !

To leave a comment for the author, please follow the link and comment on their blog: R – Modern Data.

R-bloggers.com offers daily e-mail updates about R news and tutorials about learning R and many other topics. Click here if you're looking to post or find an R/data-science job.
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.



If you got this far, why not subscribe for updates from the site? Choose your flavor: e-mail, twitter, RSS, or facebook...

Comments are closed.

Search R-bloggers

Sponsors

Never miss an update!
Subscribe to R-bloggers to receive
e-mails with the latest R posts.
(You will not see this message again.)

Click here to close (This popup will not appear again)