I am trying to build an animation in Dash and was hitting some challenges getting the usually Plotly buttons to show for “play”, as well as the slider control. So I thought that I can actually design these buttons myself in Dash using existing slider and button components.
My question was how to manually evolve an animation forward in time. Say I compute all of the animation frames, and I
save those frames to a dictionary, where the key is the iteration number and the value is the frame x,y vectors. I could also save the individual figures to the dictionary if that is better–I just was not sure of the right way to go. I was trying to figure out the best way to setup a button that upon click, will advance the frame to the next frame. I also want to setup a slider where I can advance the slider and the corresponding frame displays on the screen.
To manually advance a frame, I could just replot the figure in the Dash layout dcc.Graph
component. So I would just take in the current n_clicks
from the button, pull in the dictionary of frames, and then plot the frame where n_clicks == iteration number
. That is one way to do it, but I will end up repainting the plot on each button click.
I was not sure if there is an easier way to say update only 1 trace of a plot with multiple traces. For example I might have 4 traces in a line plot, but only 1 trace is animated. So I imagine that redrawing all 4 lines each time is wasteful when I really only need to redraw a single line. But I am not sure if something like that is possible.
I also imagine that if I am trying to use the slider to animate the frames, then repainting the plot each time will look very clunky and slow?
So again, I was just trying to figure out if there is a better way to manually animate the frames and smoothly advance them forward in the dcc.Graph
display.