First of multiple plots blank in Jupyter when using iframe renderer.

In trying to get Plotly plots to show in JupyterLab in my multi-environment setup, I came across two issues (#2508 and #2672) where one of the solutions mentioned is to set the default renderer to "iframe".

After consulting the Troubleshooting guide, I ultimately discovered that my mistake was. Even though I was using a 3.x version of JupyterLab, I still had to run jupyter labextension install @jupyter-widgets/jupyterlab-manager jupyterlab-plotly because of my multi-environment setup. Additionally, ipywidgets had to be installed in the environment with Plotly rather than the one with Jupyter. Before finding that solution, however, I tested the iframe solution, and noticed what seems to be a small bug.

If the default renderer is "iframe" and two plots are created and shown in the same cell of a JupyterLab or Jupyter Notebook .ipynb notebook, the first plot will not render (blank space will be in its place), though the second cell will render fine. If one closes the .ipynb and then re-opens it, however, both plots will show up fine. Below is an example cell with two plots.

import plotly.express as px

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

df = px.data.tips()
fig = px.histogram(df, x="total_bill")
fig.show()

fig2 = px.histogram(df, x="day")
fig2.show()

A screenshot of the output:

If more than two plots are used, generally, only the last one will show up without reopening the file. I think I observed a few times where only the first one would be blank and all remaining would show up, but if this does happen, it is rare, since I have been unable to reproduce that.

I first observed this in Firefox 97.0, JupyterLab 3.29, and Plotly 5.1.0. However, I also tested with the latest version of Plotly (5.6.0) and observed the same behaviour.

Commencez par exécuter l’exemple Python fourni dans un JupyterLab ou un Jupyter Notebook .ipynb avec pio.renderers.default défini sur "iframe" et deux appels à fig.show() dans une cellule. Comparez les premier et deuxième graphiques, puis vérifiez le comportement du renderer iframe lorsque le notebook est rouvert. C’est terminé lorsque les deux graphiques sont rendus immédiatement sans rouvrir le fichier.