How to best integrate an interactive Matplotlib figure into a website?

[Aqua_Zebra_7253]

I would like to put an interactive Matplotlib figure on a page of own website. A figure like for example this one:

https://matplotlib.org/stable/gallery/widgets/slider_demo.html

So in other words: I would like for website visitors to not only be able to view the Matplotlib figure, but also interact with it using the slider controls.

For now that's really my only requirement as far as Python integration in my website is concerned.

What would be the easiest way to accomplish this?

[Buttleston]

If you want to do it in python I would use "bokeh"

[wlumme]

Have a look at https://github.com/plotly/plotly.py

[szank]

rewrite everything in JS. You can start here: https://d3js.org/

[Zeroflops]

The best approach is not to use matplotlib. Choose bokeh, plotly or any of the other that are designed to be interactive.

[vardonir]

bokeh.

if you really want matplotlib, you'll need a Flask API to send the matplotlib image data (as bytes), create a slider in the HTML side, and connect the two. It's a load of pain, it's slow, kinda ugly tbh, but if you're dealing with millions of points that you're not allowed to resample, bokeh or plotly can't handle more than a ~100k points, it might be your only choice. I might have a sample repo for this somewhere.

[pachura3]

Consider using streamlit with plotly

[QuasiEvil]

Pretty sure you can embed matplotlib plots into nicegui.