Animating axis and data changes results in data change jumping

📊 Plotly Python
1

Hi Everyone,

I would like to animate some data where the axis range also changes. When I have frames that include both a change in axis range and data the animation shows a smooth change in the axis but the data change only jumps in at the end of the duration. However if I remove the axis change then the data change is smoothly animated.

The below example demonstrates the former case where the data jumps at the end of the transition.

import plotly.graph_objects as go

fig_dict = {
    'data':[go.Scatter(x = [0,1], y = [0,1])],
    'layout' : {
        'yaxis': {'range':[-1, 2]},
        'updatemenus':[
            {
                'type': 'buttons',
                'buttons':[
                    {
                        'label':'Play',
                        'method': 'animate',
                        'args': [
                            None, 
                            {"frame": 
                                {"duration": 3000, "redraw": False},
                                "fromcurrent": False, 
                                "transition": {
                                    "duration": 1000,
                                    "easing": "quadratic-in-out"
                                }}]}]}]},
    'frames': [
        go.Frame(
            data = [go.Scatter(x = [0,1], y = [0,2])],
            layout = {'yaxis': {'range':[-1, 3]}}
        )
    ]
}
go.Figure(fig_dict).show()

I could set the axis ranges to the most extreme values so we don’t have to change the range in the animation but I want to keep a constant zoom level around the visible data.

Using plotly 4.6.0.

Is there a way to smoothly animate both the axis and data alterations?

1 Like