• Presentation: http://patilv.com/INRUG-InteractiveCharts
• Single page version of this presentation: http://patilv.com/INRUG-InteractiveCharts/allinone.html
• Created using R markdown and R-Studio
• GitHub repository for source : https://github.com/patilv/INRUG-InteractiveCharts

• htmlwidgets: Ramnath Vaidyanathan, Kenton Russell, and RStudio

• rCharts (a transition to 2.0 using htmlwidgets is underway): Ramnath Vaidyanathan

• Provide the ability, from within R, to create, customize and publish interactive JavaScript (JS) visualizations
• JS is a computer programming language that can create interactivity using web browsers

• There are many pre-written JS libraries that make the process of creating visualizations easier.

install.packages("htmlwidgets")

• Different JS libraries developed independently - consistency in calls can at times be a challenge
• Customization for specific needs may require writing JS code

Learning approach

• Follow examples, questions, and issues presented in different venues
• Stick to few JS libraries which provide many choices of charts and become very familiar with them. Don't forget that few have restrictions for commercial use.

• htmlwidgets
  • htmlwidgets' site
  • Timelyportfolio's challenge - A widget a week
  • Ryan Hafen's gallery of htmlwidgets developed by different people
  • Search GitHub for htmlwidgets
• rCharts (A reboot to an htmlwidgets version is on the way)
  • rCharts' website and its gallery of submissions from different people.
  • rCharts on GitHub and the issues posted there and on

library(htmlwidgets)
suppressPackageStartupMessages(library(dplyr))
library(DT)# if (!require("DT")) install.packages('DT')
dt=datatable(iris, options=list(pageLength = 5))
saveWidget(dt,file = "dt.html",selfcontained = TRUE)

head(mtcars)

library(d3heatmap)#if (!require("d3heatmap")) devtools::install_github("rstudio/d3heatmap")
myheatmap=d3heatmap(mtcars,scale="column")
saveWidget(myheatmap,file = "myheatmap.html",selfcontained = TRUE)

See examples of different types here.

suppressPackageStartupMessages(library(rcdimple)) # demo(dimple) for tons of examples#if (!require("rcdimple")) devtools::install_github("timelyportfolio/rcdimple")
myirisplot=iris%>% dimple(x = "Sepal.Length",
  y = "Sepal.Width",
  groups = "Species",
  type = "bubble",width=600,height=380)%>% yAxis( overrideMin = 2)%>%
  add_legend()
saveWidget(myirisplot,file = "myirisplot.html",selfcontained = TRUE)

gearam=mtcars%>%group_by(gear,am)%>%summarise(count=length(gear))
gearam$am<-ifelse(gearam$am==0,yes= "Auto",no= "Manual")
gearam

mydimplebarplot=gearam%>%dimple(
    x = c("gear","am"), y = "count",
    groups = "am", type = "bar",width=600,height=390)%>%
   add_legend()
saveWidget(mydimplebarplot,file = "mydimplebarplot.html",selfcontained = TRUE)

library(taucharts)#if (!require("taucharts")) devtools::install_github("hrbrmstr/taucharts")
tauirisplot=iris %>% tauchart(height=500,width=800)%>% 
  tau_point(x="Sepal.Length",y="Sepal.Width",color="Species")%>%
  tau_tooltip(c("Sepal.Length", "Sepal.Width", "Species"))%>% 
  tau_guide_y(auto_scale=FALSE)%>% 
  tau_guide_x(auto_scale=FALSE)%>%tau_legend()
saveWidget(tauirisplot,file = "tauirisplot.html",selfcontained = TRUE)

gearam$gear=as.factor(gearam$gear)
gearbartauplot=tauchart(gearam)%>%tau_bar("gear","count","am")%>%
  tau_tooltip(c("gear", "am", "count"))%>% tau_legend()
saveWidget(gearbartauplot,file = "gearbartauplot.html",selfcontained = TRUE)

Scatter and line plots (time-series data), grids/facets of graphs, and connected graphs

#if (!require("metricsgraphics")) devtools::install_github("hrbrmstr/metricsgraphics")
library(metricsgraphics)
irismetricsplot=iris %>% mjs_plot(x=Sepal.Length,y=Sepal.Width) %>%
  mjs_point(color_accessor=Species, color_type="category")%>%
    mjs_labs(x="Sepal.Length", y="Sepal.Width")%>% 
    mjs_axis_y(min_y=2)
saveWidget(irismetricsplot,file = "irismetricsplot.html",selfcontained = TRUE)

http://hafen.github.io/rbokeh/: Bar missing

library(rbokeh)#if (!require("rbokeh")) devtools::install_github("bokeh/rbokeh")
bokehirisplot=figure() %>%
  ly_points(Sepal.Length, Sepal.Width, data = iris,
    color = Species,
    hover = list(Sepal.Length, Sepal.Width))
saveWidget(bokehirisplot,file = "bokehirisplot.html",selfcontained = TRUE)

#if (!require("pairsD3")) devtools::install_github("garthtarr/pairsD3")
library(pairsD3)
pairsd3plot=pairsD3(iris[,1:4],group=iris[,5])#%>%savePairs(file = 'iris.html')
saveWidget(pairsd3plot,file = "pairsd3plot.html",selfcontained = TRUE)

#if (!require("scatterMatrixD3")) devtools::install_github("jcizel/scatterMatrixD3")
library(scatterMatrixD3)
scattermatplot=scatterMatrix(
   data = iris
)
saveWidget(scattermatplot,file = "scattermatplot.html",selfcontained = TRUE)

#if (!require("streamgraph")) devtools::install_github("hrbrmstr/streamgraph")
library(streamgraph)
library(babynames)
head(babynames,3)
maryplot=babynames %>%
  filter(grepl("^Mar", name)) %>%
  group_by(year, name) %>%
  tally(wt=n) %>%
  streamgraph("name", "n", "year")
saveWidget(maryplot,file = "maryplot.html",selfcontained = TRUE)

#if (!require("svgPanZoom")) devtools::install_github("timelyportfolio/svgPanZoom")
library(svgPanZoom)
library(ggplot2)
mynewggplot=svgPanZoom(
  ggplot(iris,aes(Sepal.Length,Sepal.Width,color=Species))+geom_point()
)

saveWidget(mynewggplot,file = "mynewggplot.html",selfcontained = TRUE)

#if (!require("parcoords")) devtools::install_github("timelyportfolio/parcoords")
library(parcoords)
mymtcarsplot=parcoords(mtcars,brushMode = "1D-axes-multi")
saveWidget(mymtcarsplot,file = "mymtcarsplot.html",selfcontained = TRUE)

#if (!require("sunburstR")) devtools::install_github("timelyportfolio/sunburstR")
library(sunburstR)
school=read.csv("school.csv")
school

school$combo=paste(school$School,school$Department,school$Specialization,sep="-")
school$combo=gsub("-$","",school$combo)
head(school,1)

myburst=sunburst(school[,c(5,4)])
saveWidget(myburst,file = "myburst.html",selfcontained = TRUE)

• leaflet: Mapping
• Network data and Graph Diagrams
  • mermaid and grViz: DiagrammeR
  • Vivagraph: vivagRaph
  • d3Network: networkD3
  • Circle plot: edgebundleR
  • sigma: sigma,
  • hive: d3hiveR
• ggvis
• googleVis
• Server based interactivity - shiny