Chapter 4 Interactive Graphics

R has an increasingly diverse set of tools for creating interactive graphs. You’ve already seen some with shiny and shiny gadgets. These tools, however, rely on running R in the background. Other tools convert the graphs into javascript displays that can be embedded into web pages and html presentations. We’ll see a great version of that later for maps with leaflet. A related approach connects R with other well developed ploting systems that have interactivity and other nice features, like highly novel default plotting types.

Two well developed plotting libraries are plot.ly and Google Charts. Both have excellent tools for building, adapting and displaying interactive graphics on the web. They also have companion facilities for entering and manipulating the data, such as google sheets. However, it is often the case that advanced data analysis is being performed in R, with a desire to send final visualizations to a Google Chart or plot.ly plot. This chapter has those use cases in mind. The relevant R packages are googleVis and plot.ly. In the case of plot.ly, the R package is created by the company that produces the graphics program. Nonetheless, both packages are expansive and well documented. We’ll cover googleVis first.

4.1 googleVis

Watch these videos befores beginning: part 1, part 2.

The basic idea of a googleVis chart is that one uses R to set up their data in the format required by googleVis, the googleVis R function creates a relevant HTML page. The resulting HTML page has uses Google Charts javscript libraries and the result is an interactive HTML graphic.

Of course, if you haven’t done it already make sure to install googleVis (for example by install.packages("googleVis")), which only needs to be done once and then load it library(googleVis). The googleVis package is exceptionally well documented. In this chapter we basically go through a tour of the manual to give users a push on some simple starting points. After finishing the chapter, you should be able to build on these examples to use all of the aspects of googleVis.

A simple example of creating a Google Chart in R is given below. First we create a simple dataset then plot it with a bar chart. Let’s create a dataset with the Coursera Data Science Specialization instructors’ age and twitter follwers in thousands. (Note the ages are fake, since I don’t actually know Jeff or Roger’s ages.)

## Create a simple data set
df = data.frame(Instructor=c("Brian", "Roger", "Jef"), 
                Age=c(43,39,34), 
                Twitter=c(7.9,22.4,13.9))
bar = gvisBarChart(df, xvar="Instructor", yvar=c("Age","Twitter"))
bar
BarChartID75ce1b491fa9

Data: data • Chart ID: BarChartID75ce1b491fa9googleVis-0.6.2
R version 3.3.2 (2016-10-31) • Google Terms of UseDocumentation and Data Policy

Clearly Brian needs to step up his tweeting.

If you are viewing this book as a web page, note the interactivity by hovering over the lines. If you are running the code locally, you might have noticed that calling bar did not create the plot, print(bar) would behave similarly. Instead, these commands print the relevant HTML for the plot. It is shown this way as this is what is required to embed the plot into a compiled R markdown document with knitr. To get the results to show, use the chunk option results = 'asis'.

Perhaps the easiest way to vizalize the results is to use the S3 plotting method associated with googleVis objects.

plot(Line)

This will create a temporary HTML file and open it up using a local server. Displaying the plot to the world will require your hosting the plot somewhere else. An easy way to do this, as we have done for this book, is to embed the graphics using knitr then hosting your knitr document as you usually do. Alternatively, you can grab the code for the graphic and embed it into any hosted web page that you create. The developers anticipated this use case and hence the various utilities for printing out the HTML and javascript. Most usefully, the print method associated with googleVis objects will prints out the code with various amounts of HTML preamble. ?print.gvis shows the options.

The googleVis package has several plotting functions. Some of the main ones include:

  • Motion charts: gvisMotionChart
  • Interactive maps: gvisGeoChart
  • Interactive tables: gvisTable
  • Line charts: gvisLineChart
  • Bar charts: gvisColumnChart
  • Tree maps: gvisTreeMap

The full documentation can be found here. We’ll cover a few examples and from those you should easily be able to generalize to the others covered in the package.

A geoChart is an interactive map. Thus googleVis can match much of the functionality of leaflet. Consider this plot of the Exports dataset. First, look at the data.

head(Exports)
##         Country Profit Online
## 1       Germany      3   TRUE
## 2        Brazil      4  FALSE
## 3 United States      5   TRUE
## 4        France      4   TRUE
## 5       Hungary      3  FALSE
## 6         India      2   TRUE
G = gvisGeoChart(Exports, locationvar="Country",
                  colorvar="Profit",options=list(width=600, height=400))
print(G,"chart")

Options in a googleVis chart are given in a list format. These are well documented in the help manual for each function. The parameters have to be set to the named value in Google Charts documentation for the associated chart. For example, consider the gvisGeoChart function. It’s options can be found here.

For example, you can zoom the plot in on a specific region by specifying region= in the options list. Consider focusing the map on Europe. The region codes are given here.

G2 = gvisGeoChart(Exports, locationvar="Country",
                  colorvar="Profit",options=list(width=600, height=400,region="150"))
print(G2,"chart")

Let’s consider setting more options