HTML exports of Jupyter Lab notebooks

📊 Plotly Python
1

In Jupiter Notebook, there used to be an init_notebook_mode method that would inject the JS code into the page and HTML exports of a notebook would export the graphs as Javascript Objects.

With Jupyter Lab, this is no longer the case as Javascript code is not run. We’re meant to use the new FigureWidget objects from the API, and they display correctly in a Jupyter Lab notebook, but they do not work with HTML exports at all as they get converted to blank outputs.

Using iplot shows interactive output from the Jupyter Lab notebooks (through the @jupyterlab/plotly-extension), however exporting turns these interactive outputs into images.

Am I doing anything wrong here?
What is the recommended way of exporting Jupyter Lab notebooks that include interactive plot.ly graphs?

2

Hi @Allezxandre,

The iplot approach is the best approach for exporting notebooks in standalone form. The reason you’re seeing static images and not the interactive output is due to this bug: https://github.com/jupyterlab/jupyter-renderers/issues/158. I submitted a pull request to fix it yesterday (https://github.com/jupyterlab/jupyter-renderers/pull/159) so hopefully that will get that incorporated and released pretty soon.

-Jon

1 Like
3

Awesome, thank you!

I saw your pull request and subscribed to it, yet I wasn’t sure it would fix this problem.

So just to make sure, as long as the plotly renderer widgets are installed, iplot doesn’t require init_notebook_mode anymore for rendering and exporting plot.ly JS graphs in Jupyter Lab?

4

That’s correct. You don’t need init_notebook_mode in JupyterLab, you need to have the @jupyterlab/plotly-extension extension installed.

5

And, these fixes were just merged and released in @jupyterlab/plotly-extension version 0.17.2. Give it a try and let me know if it does in fact fix the problem for you. Thanks!

6

It works! Thank you!

On a side note, I’d point out for future reference that init_notebook_mode is required for the exported HTML to include the Plotly JS imports. @jupyterlab/plotly-extension only handles rendering from within Jupiter Lab (which makes sense)

1 Like
7

Glad it works for you! And thanks for pointing out the role of init_notebook_mode in the HTML export process.
-Jon

8

Hi @jmmease,

Any idea if we can export a jupyter notebook via jupyterlab without the plotlyjs and have it called by CDN to reduce the size of the html file?

9

Hi @jbosch,

If you call init_notebook_mode with the connected=True argument then the notebook will contain a reference to plotly.js on the CDN.

Hope that helps!
-Jon