Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

.animate method that can handle any type of figure diff

See original GitHub issue

In Dash, I’d like users to be able to toggle on and off an animate property which would either smoothly transition points (if available) or just update the chart.

Right now, Plotly.animate doesn’t work with all chart transitions and data transitions. While I could program this myself in the Graph component, it would be great if plotly.js could do this so that everyone could benefit. We could even use this in the workspace to smooth out transitions!

Ideally, I would just replace the .newPlot(id, data, layout) call with a .animate(id, data, layout) call and call it a day.

In particular, here are some of the edge cases:

.animate to work before .plot is called
.animate to work across all chart types (even if it’s not a smooth animation)
.animate to autorange (expand axes if the new data was larger than the existing data)
.animate when new traces are added or removed
.animate when chart types have been changed

I’m OK if this is a new method or a new config option or whatever.

cc @rreusser @alexcjohnson @etpinard @cpsievert @monfera @jackparmer

Issue Analytics

State:
Created 6 years ago
Reactions:4
Comments:14 (13 by maintainers)

Top GitHub Comments

1reaction

nicolaskruchtencommented, Sep 6, 2018

FWIW I would favour having an animate flag somewhere such that .react() would animate a transition or something like that, rather than a .animate() method.

1reaction

etpinardcommented, Jul 4, 2017

.animate to autorange (expand axes if the new data was larger than the existing data)

That’s arguably not always the desired behavior. We’ll probably need another attribute.

Top Results From Across the Web

Transform and combine graphic objects in Animate

Use this guide to understand how to transform and combine objects in Animate.

.animate() | jQuery API Documentation

A string or number determining how long the animation will run. ... The .animate() method allows us to create animation effects on any...

jQuery animate() Method

The animate() method performs a custom animation of a set of CSS properties. This method changes an element from one state to another...

The 5 Types of Animation - A Beginner's Guide

The purpose of this guide is to take you through the intricacies of the different types of animation styles and techniques. It also...

Create advanced animations with smart animate

Smart animate looks for matching layers, recognizes differences, and animates layers between frames in a prototype. You can select Smart animate from the ......