Jupyter: built-in interactive widgets

Question

According to the Jupyter blog here , you can now embed interactive widgets in a static web page:

Now interactive widgets can now be embedded in static web pages or blogs by inserting an html fragment containing the serialized state of the widgets. It also works with custom widget libraries. See http://jupyter.org/embed-jupyter-widgets.html .

When I open the example above in firefox or chrome, I get the interactive widgets in order!

However, if I create a new laptop with the same bit of python code, save the laptop as html and then copy the embedded HTML snippet to display interactive widgets, it does not work. In the best case, I get an image of the state of the widget, but nothing interactive.

Has anyone managed to replicate an HTML page using interactive widgets? Is there something I'm missing?

Answer 1

We made Kyso just for this. You can embed a Jupyter notebook into your website using kyso.io, and while the widgets are supported by the BokehJS panel, the notebook will be interactive. Here is an example

PS. (disclaimer - I am the founder of kyso)

Answer 2

It has been a long time since the question was asked, but I will answer using modern technology.

To embed interactive widgets, you need a backend, but there is a project called MyBinder that you can use as a backend in the cloud for free. This served as the basis for a library called NBinteract , which can convert any notepad with interactive widgets into one HTML page.

These HTML files load the script from cdn and independently manage all interaction with MyBinder.

There are several examples on their website, and I also posted a blog post where I used this technology along with Dockerfile, ffmpeg, matplotlib, animation, and interactive widgets. Therefore, I believe that this approach is quite reliable and flexible.

The official docs say you need a repo, but I could use histologists instead and introduced a problem in the main repo explaining how to do this.