How to embed an interactive matplotlib plot in a webpage

Question

I have been searching how to embed an interactive matplotlib widget (like this one: http://matplotlib.org/examples/widgets/slider_demo.html) in a webpage. The final aim is to make an educational page.

I hope I am not duplicating the question. What google finds is always how to embed the plot as a still-shot, in an image format.

I thought I can do something with ipython notebook or plotly or gjango. But I got confused.

Is it possible at all for intractive plots? I appreciate your guides to which direction I should think and work on.

Thank you.

Answer 1

In summer 2015, I'm facing a similar task: embed interactive widgets that change their underlying data when the slider is moved. This is very similar to interactive IPython widgets which are interactive when run on a local machine. Examples of what I want can be found jakevdp's blog.

To summarize work done so far:

• ipywidgets-static converts interactive IPython widgets to static HTML. However, this library is no longer maintained. Development has moved to ipython/ipywidgets.
• IPython is working on ipython/ipywidgets. They have a Github issue to make these widgets static and to be embedded in a standalone HTML file.
• HoloViews provides some interactive slider options that can be embedded in a static HTML file (using IPython's nbconvert)
• Bokeh plots that rely on interactive sliders require a server.
• plot.ly doesn't support sliders/etc. I believe this is true based off this blog post.
• mpld3 converts between matplotlib and d3. I believe this library supports panning and zooming, not sliders/interactivity. Here's a related Github issue

There's also blog post titled "Scientific Python in the browser: it's coming!". This post was dated 2014-3-31.

For me, the two most attractive options are ipywidgets and HoloViews but I'm looking forward to when IPython provides static interactive widgets. I expect to see solid support for static interactive widgets quickly and in less that 5 years/2020 (and in 2 years/2017?).

Answer 2

As of Early April 2014 the answer is yes. Based on the work going on in this space, I expect the quality and quantity of such libraries to continue to improve very quickly.

IPython 2.0, specifically the notebook, supports interactive controls, which was covered in some detail by Brian Granger in his talk IPython - The Attributes of Software and How They Affect Our Work (see from 32:25 onward for the bits you're interested in)

There are some amazing projects being worked on at the moment that combine server and client side code for the next generation of python visualisation libraries. At the moment this includes the work on MPLD3 and the ipywidgets library. There are some great interactive plots on Jake Vanderplas' blog Pythonic Perambulations that show demonstrate this.