matplotlib figure not captured by `Output`

👉 see solution below

Describe the issue

I have troubles correctly placing matplotlib figures in an ipywidgets.VBox using ipywidgets.Output. I would like to capture the plot in an Output that gets arranged in a VBox above another widget. However it does not look like the figure gets captured by the Output, see below

here is the expected output with ipympl=0.7.0:

and here it is with ipympl=0.8.0

MWE

%matplotlib widget

from ipywidgets import Button, Output, VBox
from matplotlib import pyplot as plt
out = Output()
out.layout.border = "2px solid green"
with out:
    fig, ax = plt.subplots(1, 1)
VBox([out, Button(description="click")])

Versions

examples created with a fresh minimal conda environment:

mamba create -n envA python=3.9 jupyterlab=3 ipympl=0.8
mamba create -n envB python=3.9 jupyterlab=3 ipympl=0.7

diff

--- "a/.\\envA_out.txt"
+++ "b/.\\envB_out.txt"
@@ -1,5 +1,5 @@
  3.9.7 | packaged by conda-forge | (default, Sep 29 2021, 19:15:42) [MSC v.1916 64 bit (AMD64)]
-ipympl version: 0.8.0
+ipympl version: 0.7.0
 Selected Jupyter core packages...
 IPython          : 7.28.0
 ipykernel        : 6.4.1
@@ -26,5 +26,5 @@ Known nbextensions:
       - Validating: ok
 JupyterLab v3.1.14
 ~\jupyter\labextensions
-        jupyter-matplotlib v0.10.0 enabled ok
+        jupyter-matplotlib v0.9.0 enabled ok
         @jupyter-widgets/jupyterlab-manager v3.0.1 enabled ok (python, jupyterlab_widgets)

ipympl=0.8.0

 3.9.7 | packaged by conda-forge | (default, Sep 29 2021, 19:15:42) [MSC v.1916 64 bit (AMD64)]
ipympl version: 0.8.0
Selected Jupyter core packages...
IPython          : 7.28.0
ipykernel        : 6.4.1
ipywidgets       : 7.6.5
jupyter_client   : 7.0.5
jupyter_core     : 4.8.1
jupyter_server   : 1.11.1
jupyterlab       : 3.1.14
nbclient         : 0.5.4
nbconvert        : 6.2.0
nbformat         : 5.1.3
notebook         : 6.4.4
qtconsole        : not installed
traitlets        : 5.1.0
Known nbextensions:
  config dir: ~\.jupyter\nbconfig
    notebook section
      ipygany disabled
  config dir: ~\etc\jupyter\nbconfig
    notebook section
      jupyter-matplotlib/extension enabled
      - Validating: ok
      jupyter-js-widgets/extension enabled
      - Validating: ok
JupyterLab v3.1.14
~\jupyter\labextensions
        jupyter-matplotlib v0.10.0 enabled ok
        @jupyter-widgets/jupyterlab-manager v3.0.1 enabled ok (python, jupyterlab_widgets)

ipympl=0.7.0

 3.9.7 | packaged by conda-forge | (default, Sep 29 2021, 19:15:42) [MSC v.1916 64 bit (AMD64)]
ipympl version: 0.7.0
Selected Jupyter core packages...
IPython          : 7.28.0
ipykernel        : 6.4.1
ipywidgets       : 7.6.5
jupyter_client   : 7.0.5
jupyter_core     : 4.8.1
jupyter_server   : 1.11.1
jupyterlab       : 3.1.14
nbclient         : 0.5.4
nbconvert        : 6.2.0
nbformat         : 5.1.3
notebook         : 6.4.4
qtconsole        : not installed
traitlets        : 5.1.0
Known nbextensions:
  config dir: ~\.jupyter\nbconfig
    notebook section
      ipygany disabled
  config dir: ~\etc\jupyter\nbconfig
    notebook section
      jupyter-matplotlib/extension enabled
      - Validating: ok
      jupyter-js-widgets/extension enabled
      - Validating: ok
JupyterLab v3.1.14
~\jupyter\labextensions
        jupyter-matplotlib v0.9.0 enabled ok
        @jupyter-widgets/jupyterlab-manager v3.0.1 enabled ok (python, jupyterlab_widgets)

[ianhi]

Note that plt.ioff will have other side effects. like not always showing figures created in new cells!

So you may want to call plt.ion at some point, or use plt.ioff as a contextmanager:

%matplotlib widget

from ipywidgets import Button, Output, VBox
from matplotlib import pyplot as plt


out = Output()
out.layout.border = "2px solid green"

with plt.ioff():
    with out:
        fig, ax = plt.subplots(1, 1)
        display(fig.canvas)

VBox([out, Button(description="click")])

also you don’t need to wrap the canvas in a on output widget, it can be directly placed into the vbox:

VBox([fig.canvas, Button(description="click")])

The interactions and layout section of: https://github.com/matplotlib/ipympl/blob/master/examples/ipympl.ipynb may be helpful

[martinRenou]

Oups, sorry, the code should have been:

%matplotlib widget

from ipywidgets import Button, Output, VBox
from matplotlib import pyplot as plt

plt.ioff()

out = Output()
out.layout.border = "2px solid green"

with out:
    fig, ax = plt.subplots(1, 1)
    display(fig.canvas)

VBox([out, Button(description="click")])

fig gives the static figure, fig.canvas gives the widget