The ggiraph package let R users make ggplot interactive. The package is an htmlwidget. Below is an example:

It extends ggplot2 with new geom functions:

  • geom_bar_interactive
  • geom_boxplot_interactive
  • geom_line_interactive
  • geom_map_interactive
  • geom_path_interactive
  • geom_point_interactive
  • geom_polygon_interactive
  • geom_rect_interactive
  • geom_segment_interactive
  • geom_text_interactive
  • geom_tile_interactive

These understand three aesthetics to let you add interactivity:

  • tooltip: column of dataset that contains tooltips to be displayed when mouse is over elements.
  • onclick: column of dataset that contains javascript function to be executed when elements are clicked.
  • data_id: column of dataset that contains id to be associated with elements. This aesthetic is mandatory when you want to use an hover effect or when you want to enable selection of points in shiny applications.

Let’s prepare a ggplot object with the mpg dataset.

library(ggiraph)

head(mpg)
## # A tibble: 6 x 11
##   manufacturer model displ  year   cyl      trans   drv   cty   hwy    fl
##          <chr> <chr> <dbl> <int> <int>      <chr> <chr> <int> <int> <chr>
## 1         audi    a4   1.8  1999     4   auto(l5)     f    18    29     p
## 2         audi    a4   1.8  1999     4 manual(m5)     f    21    29     p
## 3         audi    a4   2.0  2008     4 manual(m6)     f    20    31     p
## 4         audi    a4   2.0  2008     4   auto(av)     f    21    30     p
## 5         audi    a4   2.8  1999     6   auto(l5)     f    16    26     p
## 6         audi    a4   2.8  1999     6 manual(m5)     f    18    26     p
## # ... with 1 more variables: class <chr>
g <- ggplot(mpg, aes( x = displ, y = cty, color = hwy) )

tooltips

The first example shows how to add a tooltip:

my_gg <- g + geom_point_interactive(aes(tooltip = model), size = 2) 
ggiraph(code = print(my_gg) )

hover effects

Now let’s add an hover effect. Elements associated with a data_id will be animated upon mouse over.

my_gg <- g + geom_point_interactive(
    aes(tooltip = model, data_id = model), size = 2) 
ggiraph(code = print(my_gg), hover_css = "cursor:pointer;fill:red;stroke:red;")

The default value of hover css is hover_css = "fill:orange;". To see how to change that, read the custome_effects vignette.

Note that data-id can also be reused within a shiny application.

Click actions

Using onclick

Click actions must be a string column in the dataset containing valid javascript instructions.

crimes <- data.frame(state = tolower(rownames(USArrests)), USArrests)
head(crimes)
##                 state Murder Assault UrbanPop Rape
## Alabama       alabama   13.2     236       58 21.2
## Alaska         alaska   10.0     263       48 44.5
## Arizona       arizona    8.1     294       80 31.0
## Arkansas     arkansas    8.8     190       50 19.5
## California california    9.0     276       91 40.6
## Colorado     colorado    7.9     204       78 38.7
# create an 'onclick' column
crimes$onclick <- sprintf("window.open(\"%s%s\")",
  "http://en.wikipedia.org/wiki/", as.character(crimes$state) )

gg_crime <- ggplot(crimes, aes(x = Murder, y = Assault, color = UrbanPop )) + 
  geom_point_interactive(
    aes( data_id = state, tooltip = state, onclick = onclick ), size = 3 ) + 
  scale_colour_gradient(low = "#999999", high = "#FF3333")

ggiraph(code = print(gg_crime), hover_css = "fill-opacity:.3;cursor:pointer;")

within shiny

When working with shiny, you can use the data_id aesthetic to associate points, polygons and other graphical elements with a value that will be available in a reactive context. This makes it possible to click on an element and trigger an action. More details are available in vignette “ggiraph in shiny”. Note that in this case, onclick should not be used, both onclick and data_id will need the “click” event.