How to plot a matplotlib animation in my streamlit app?

I need to generate an animation in an application that I am building in streamlit.

At first, I generated the animation as follows:

ani = FuncAnimation(fig, animate, frames=range(0,len(x),skipframes), interval=30, blit = True, repeat = False)

HTML(ani.to_jshtml())

components.html(ani.to_jshtml(),height=800)

However, the plot takes a long time to appear (about 20 seconds), perhaps because it is in a heavier format than a simple gif. Locally in pycharm the plot is faster (about 5 seconds) and I used the following command

ani = FuncAnimation(fig, animate, frames=range(0,len(x),skipframes), interval=30, blit = True, repeat = False)

plt.show()

But when I use it on streamlit the plot just doesn’t appear. The code runs, but no graphics, animations or errors appear.

To plot in gif format on streamlit do I need to make some kind of change? Or is there any way to generate the animation in a lighter way than the HTML videos on this site?

I’m still having a problem with this issue. Are there other ways to plot an animation on streamlit?

Thanks for any help

You could likely cut down the delay in half by removing the line:

HTML(ani.to_jshtml())

The function ani.to_jshtml() seems to be the bottleneck, and you’re calling it twice in the above snippet.

Here are a few more forum topics about FunctionAnimation.

Best,
Snehan

1 Like

Thanks for the answer. I made the change you indicated, but the plotting time remained practically the same. Would you have another idea? I think this HTML format gets a little heavy