Intro to Animations in ggplot2

How to create animations in ggplot2 with Plotly.

Plotly Studio: Transform any dataset into an interactive data application in minutes with AI. Try Plotly Studio now.

Note: We are retiring documentation for R, MATLAB, Julia, and F# in November 2025. Learn more about this change here.

Frames

Now, along with data and layout, frames is added to the keys that figure allows. Your frames key points to a list of figures, each of which will be cycled through upon instantiation of the plot.

Basic Example

library(plotly)
library(ggplot2)

df <- data.frame(
  x = c(1,2,3,4), 
  y = c(1,2,3,4), 
  f = c(1,2,3,4)
)

p <- ggplot(df, aes(x, y)) +
    geom_point(aes(frame = f))

ggplotly(p)

Mulitple Trace Animations

library(plotly)
library(ggplot2)
library(gapminder)


p <- ggplot(gapminder, aes(gdpPercap, lifeExp, color = continent)) +
  geom_point(aes(size = pop, frame = year, ids = country)) +
  scale_x_log10()

ggplotly(p)

Add Animation Options

To add options to the plot, first convert ggplot2 plot to Plotly variable with ggplotly() and then, add options to that variable.

library(plotly)
library(ggplot2)
library(gapminder)

p <- ggplot(gapminder, aes(gdpPercap, lifeExp, color = continent)) +
  geom_point(aes(size = pop, frame = year, ids = country)) +
  scale_x_log10()

fig <- ggplotly(p)

fig <- fig %>% 
  animation_opts(
    1000, easing = "elastic", redraw = FALSE
  )

fig

Add Button Options

library(plotly)
library(ggplot2)
library(gapminder)

p <- ggplot(gapminder, aes(gdpPercap, lifeExp, color = continent)) +
  geom_point(aes(size = pop, frame = year, ids = country)) +
  scale_x_log10()

fig <- ggplotly(p)

fig <- fig %>% 
  animation_opts(
    1000, easing = "elastic", redraw = FALSE
  )

fig <- fig %>% 
  animation_button(
    x = 1, xanchor = "right", y = 0, yanchor = "bottom"
  )

fig

Add Slider Options

library(plotly)
library(ggplot2)
library(gapminder)

p <- ggplot(gapminder, aes(gdpPercap, lifeExp, color = continent)) +
  geom_point(aes(size = pop, frame = year, ids = country)) +
  scale_x_log10()

fig <- ggplotly(p)

fig <- fig %>% 
  animation_opts(
    1000, easing = "elastic", redraw = FALSE
  )

fig <- fig %>% 
  animation_button(
    x = 1, xanchor = "right", y = 0, yanchor = "bottom"
  )

fig <- fig %>%
  animation_slider(
    currentvalue = list(prefix = "YEAR ", font = list(color="red"))
  )

fig

Create the plot in one function

library(plotly)
library(ggplot2)
library(gapminder)

p <- ggplot(gapminder, aes(gdpPercap, lifeExp, color = continent)) +
  geom_point(aes(size = pop, frame = year, ids = country)) +
  scale_x_log10()

fig <- ggplotly(p) %>% 
  animation_opts(
    1000, easing = "elastic", redraw = FALSE
  ) %>% 
  animation_button(
    x = 1, xanchor = "right", y = 0, yanchor = "bottom"
  ) %>%
  animation_slider(
    currentvalue = list(prefix = "YEAR ", font = list(color="red"))
  )

fig

Reference

To read more on animations see The Plotly Book.

What About Dash?

Dash for R is an open-source framework for building analytical applications, with no Javascript required, and it is tightly integrated with the Plotly graphing library.

Learn about how to install Dash for R at https://dashr.plot.ly/installation.

Everywhere in this page that you see fig, you can display the same figure in a Dash for R application by passing it to the figure argument of the Graph component from the built-in dashCoreComponents package like this:

library(plotly)

fig <- plot_ly() 
# fig <- fig %>% add_trace( ... )
# fig <- fig %>% layout( ... ) 

library(dash)
library(dashCoreComponents)
library(dashHtmlComponents)

app <- Dash$new()
app$layout(
    htmlDiv(
        list(
            dccGraph(figure=fig) 
        )
     )
)

app$run_server(debug=TRUE, dev_tools_hot_reload=FALSE)