Bring Drag & Drop to Dash with Dashboard Engine. 💫 Learn how at our next webinar!

Plotly Express Animation Frames Don't Fade Out

Hello,

I am trying to animate Google Search Results and I have encountered an error. When I play the animation, the frames are shading each other like below. At the same time, I’m animating 10 more plots. Can it be the reason here?

It doesn’t switch the frames exactly.
My code block is below.

serp['bubble_size'] = 15
fig = px.scatter(serp,
           x="displayLink", 
           y="rank", 
           color="displayLink", 
           hover_name="link", 
           hover_data=["title","link","searchTerms"],
           log_y=False, size="bubble_size", size_max=15,
           height=10000, 
           width=1000,range_y=[0,10], 
           template="plotly_white", 
           animation_group="displayLink", 
           animation_frame="queryDay",
           opacity=0.60, 
           facet_col="searchTerms", 
           facet_col_wrap=1,facet_row_spacing=0.01,
           text="displayLink")

#fig['layout'].pop('updatemenus')
"""
fig.update_layout(
    margin=dict(l=20, r=20, t=20, b=20)
)"""
fig.layout.updatemenus[0].buttons[0].args[1]["frame"]["duration"] = 1500
fig.layout.updatemenus[0].buttons[0].args[1]["transition"]["duration"] = 2000
fig.update_yaxes(categoryorder="total ascending")
fig.show(renderer='notebook')