25

I have a Jupyter notebook (python) where I used plotly express to plot in the notebook for analysis purposes. I want to share this notebook with non-coders, and have the interactive visuals be available still - but it does not seem to work.

I tried following recommendations made here but even after saving widgets state and using nbconvert, when I open the new HTML file, the visuals are not available.

A sample line of plotting can be seen below:

import plotly_express as px
fig = px.scatter(
    df, 
    x='size', 
    y='size_y', 
    color='clients',
    hover_data=['id'], 
    marginal_y="histogram", 
    marginal_x="histogram"
)
fig.show()
Kermit
  • 4,922
  • 4
  • 42
  • 74
guyts
  • 899
  • 2
  • 17
  • 34
  • Can you share a link to your notebook? Are you using `FigureWidget`? If you're not, then just `figure.show()` to display the chart and export to HTML, works without issue for me. – nicolaskruchten Aug 27 '19 at 00:48
  • I cannot share the notebook fully, but added a the line of code where I plot. I used `figure.show()` but it gave the same results, of not displaying the figures when exported to html – guyts Aug 27 '19 at 17:21
  • which version of Jupyter and Nbconvert are you using? what's the nbconvert command you're running? this works for me... – nicolaskruchten Aug 27 '19 at 20:06
  • nbconvert 5.4.1 and jupyter 1.0.0 (with Anaconda 2019.03) – guyts Aug 29 '19 at 14:55
  • I've also received this warning when trying to convert: `C:\ProgramData\Anaconda3\lib\site-packages\nbconvert\filters\datatypefilter.py:41: UserWarning: Your element with mimetype(s) dict_keys(['application/vnd.plotly.v1+json']) is not able to be represented. mimetypes=output.keys())` – guyts Aug 29 '19 at 14:56
  • For those looking to do this with notebooks you can publicly share, you can use the intact notebook hosted on Github and then provide others with the URL pointing [nbviewer](https://nbviewer.org/) at the notebook at Github. nbviewer will render the widget. Example at Github not rendering Plotly: https://github.com/fomightez/3Dscatter_plot-binder/blob/master/Plotly3d-scatter-plots.ipynb. Example of same notebook with nbviewer pointing at Github-posted notebook with Plotly actice still: https://nbviewer.org/github/fomightez/3Dscatter_plot-binder/blob/master/Plotly3d-scatter-plots.ipynb . – Wayne Jan 20 '22 at 17:01

4 Answers4

38

After running plotly.offline.init_notebook_mode() in a cell, you can export the notebook with full interactivity via the file menu: File --> Export Notebook as... --> Export Notebook to HTML.

joelostblom
  • 43,590
  • 17
  • 150
  • 159
5

I was having similar issues but with JupyterLab. Followed the instructions here: https://plot.ly/python/renderers/ . 

import plotly.io as pio
pio.renderers.keys()

I had to add the following snippet to my script:

import plotly.io as pio
pio.renderers.default = 'jupyterlab'

Exporting as HTML after that worked for me. You can read "Overriding the default renderer".

I suppose you would need 

pio.renderers.default = 'notebook'
hamiq
  • 465
  • 1
  • 3
  • 10
  • Tried doing that, but am still getting an error when creating the html version: `UserWarning: Your element with mimetype(s) dict_keys(['application/vnd.plotly.v1+json']) is not able to be represented.` which I'm assuming has to do with the fact I can't see the figures? – guyts Sep 03 '19 at 17:36
  • I think the renderers would be available in newer versions of plotly. The 4.0 update has some info on this: https://community.plot.ly/t/introducing-plotly-py-4-0-0/25639 – hamiq Sep 04 '19 at 18:18
  • This answer produces charts in the HTML output, but the charts are static. For example, tooltips and the interaction menu do not appear. – edesz Jan 12 '22 at 20:02
1

You can specify the default renderers from plotly with:

    import plotly.io as pio
    pio.renderers.default = 'pdf'

or when displaying the images with:

    fig.show(renderer="pdf")

The 2 choices for you are:

  • 'notebook': work well with jupyter notebook;
  • 'pdf': perfect when using nbconvert to convert to HTML or LATEX

You can also join the 2 with "notebook+pdf" so you have iterative plots when running the notebook and static images when converting with nbconvert.

rgime
  • 11
  • 1
0

I just had a problem that resulted in this error message.

nbconvert/filters/widgetsdatatypefilter.py:69: UserWarning: Your element with mimetype(s) dict_keys(['application/vnd.plotly.v1+json']) is not able to be represented.
  warn("Your element with mimetype(s) {mimetypes}"

Google brought me here, but I could not find a solution from the answers above.

I'm sharing the setup which caused my problem and the solution.

I was running the notebook in VS Code and then on the command line using: jupyter nbconvert

To solve it, I had to start jupyter lab and then run it and save it before running nbconvert.

haugstve
  • 115
  • 7