Animations in Dash

Thanks for reporting! Yeah, frames is not supported in figure right now. We’ll need to modify with something like:

const {data, layout, config, frames} = this.props;
Plotly.newPlot(id, data, layout, config).then(() => {
    Plotly.addFrames(id, frames);
    Plotly.animate()
})

In this case, the graph will animate whenever the graph’s frames property changes. We’ll need to experiment with this.

Another approach to the general animations is to use the animate=True property of the dcc.Graph and to tie a “play” button with a dcc.Interval component. I haven’t played around with this yet myself. A solution like this would allow you to supply the “frames” (in this case they’re just new figure properties) one by one instead of having to precompute them all upfront.

If any company out there would like for us to prioritize this work, please reach out: https://plot.ly/products/consulting-and-oem/

3 Likes