search

matplotlib / ipympl

Matplotlib Jupyter Integration
https://matplotlib.org/ipympl/
BSD 3-Clause "New" or "Revised" License
1.57k stars 227 forks source link

Notebook rendered with Voila does not show Axes in a matplotlib widget #412

Open alessioarena opened 2 years ago

alessioarena commented 2 years ago

Describe the issue

When rendering a notebook using Voila, the interactive matplotlib widget using ipympl backend is also rendered. However this widget is completely missing the Axes, therefore not showing any data at all.

A minimum reproducible code would be

%matplotlib widget

plt.ioff()
figRHF = plt.figure(figsize=(10, 5))
figRHF.canvas.layout.min_height = '400px'
axRHF = figRHF.gca()
test = axRHF.plot([0, 1], [0, 1])
print(axRHF)
print(figRHF)
print(figRHF.gca())
print(test)

display(
    figRHF.canvas
)

And this is the output from this code, on the left is the Jupyter Lab notebook output, on the right is the Voila output image

Versions

'3.8.12 | packaged by conda-forge | (default, Oct 12 2021, 21:22:46) [MSC v.1916 64 bit (AMD64)]'
ipympl version: 0.8.2

Selected Jupyter core packages...
IPython          : 7.29.0
ipykernel        : 6.5.0
ipywidgets       : 7.6.5
jupyter_client   : 6.1.12
jupyter_core     : 4.9.1
jupyter_server   : 1.11.2
jupyterlab       : 3.2.4
nbclient         : 0.5.9
nbconvert        : 6.3.0
nbformat         : 5.1.3
notebook         : 6.4.6
qtconsole        : not installed
traitlets        : 5.1.1

Known nbextensions:
  config dir: C:\Users\are014\Miniconda3\envs\humaninjurymodel\etc\jupyter\nbconfig
    notebook section
      ipydatetime/extension enabled 
      jupyter-matplotlib/extension enabled 
      voila/extension enabled 
      jupyter-js-widgets/extension enabled 

      - Validating: ok
      - Validating: ok
      - Validating: ok
      - Validating: ok

JupyterLab v3.2.4
C:\Users\are014\Miniconda3\envs\humaninjurymodel\share\jupyter\labextensions
        jupyter-matplotlib v0.10.2 enabled ok
        @jupyter-widgets/jupyterlab-manager v3.0.1 enabled ok (python, jupyterlab_widgets)
        @voila-dashboards/jupyterlab-preview v2.1.0 enabled ok (python, voila)

Other labextensions (built into JupyterLab)
   app dir: C:\Users\are014\Miniconda3\envs\humaninjurymodel\share\jupyter\lab
        jupyter-widget-datetime v1.2.0 enabled ok
pyfrid commented 2 years ago

I have the same problem with Canvas integrated to ipywidgets components, like Tabs or just any Layout. It doesn't happen always and not for all plots. But when it happens there are a lot of exception messages in the browser console:

Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The HTMLImageElement provided is in the 'broken' state.

The problem doesn't appear with ipympl version 0.7.0.

martinRenou commented 2 years ago

Have you tried upgrading to the latest release of ipympl? I've seen this issue in the Voila CI in older releases of ipympl (0.8.0) but I was able to fix it by upgrading to latest (see https://github.com/voila-dashboards/voila/pull/1048)