.. _sphx_glr_gallery_user_interfaces:

.. _user_interfaces:

Embedding Matplotlib in graphical user interfaces
=================================================

You can embed Matplotlib directly into a user interface application by
following the embedding_in_SOMEGUI.py examples here. Currently
Matplotlib supports PyQt/PySide, PyGObject, Tkinter, and wxPython.

When embedding Matplotlib in a GUI, you must use the Matplotlib API
directly rather than the pylab/pyplot procedural interface, so take a
look at the examples/api directory for some example code working with
the API.



.. raw:: html

    <div class="sphx-glr-thumbnails">


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="This example shows how to use the agg backend directly to create images, which may be of use to...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_canvasagg_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_canvasagg.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">CanvasAgg demo</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrate NavigationToolbar with GTK3 accessed via pygobject.">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_gtk3_panzoom_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_gtk3_panzoom_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in GTK3 with a navigation toolbar</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrate adding a FigureCanvasGTK3Agg widget to a Gtk.ScrolledWindow using GTK3 accessed via...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_gtk3_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_gtk3_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in GTK3</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrate NavigationToolbar with GTK4 accessed via pygobject.">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_gtk4_panzoom_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_gtk4_panzoom_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in GTK4 with a navigation toolbar</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrate adding a FigureCanvasGTK4Agg widget to a Gtk.ScrolledWindow using GTK4 accessed via...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_gtk4_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_gtk4_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in GTK4</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Simple Qt application embedding Matplotlib canvases.  This program will work equally well using...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_qt_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_qt_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in Qt</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Embedding in Tk">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_tk_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_tk_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in Tk</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="An example of how to use wxagg in an application with the new toolbar - comment out the add_too...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_wx2_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_wx2_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in wx #2</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Copyright (C) 2003-2004 Andrew Straw, Jeremy O&#x27;Donoghue and others">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_wx3_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_wx3_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in wx #3</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="An example of how to use wxagg in a wx application with a custom toolbar.">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_wx4_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_wx4_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in wx #4</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Embedding in wx #5">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_in_wx5_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_in_wx5_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in wx #5</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="This example demonstrates how to embed Matplotlib WebAgg interactive plotting in your own web a...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_embedding_webagg_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_embedding_webagg_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding WebAgg</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Fourier Demo WX">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_fourier_demo_wx_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_fourier_demo_wx_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Fourier Demo WX</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Example of embedding Matplotlib in an application and interacting with a treeview to store data...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_gtk3_spreadsheet_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_gtk3_spreadsheet_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">GTK3 spreadsheet</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Example of embedding Matplotlib in an application and interacting with a treeview to store data...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_gtk4_spreadsheet_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_gtk4_spreadsheet_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">GTK4 spreadsheet</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrates how to convert (math)text to a wx.Bitmap for display in various controls on wxPyth...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_mathtext_wx_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_mathtext_wx_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Display mathtext in WX</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Matplotlib with Glade 3">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_mpl_with_glade3_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_mpl_with_glade3_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Matplotlib with Glade 3</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="To use this hook, ensure that this module is in your PYTHONPATH, and set rcParams[&quot;figure.hooks...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_mplcvd_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_mplcvd.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">mplcvd -- an example of figure hook</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="An example of how to use pyplot to manage your figure windows, but modify the GUI by accessing ...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_pylab_with_gtk3_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_pylab_with_gtk3_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">pyplot with GTK3</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="An example of how to use pyplot to manage your figure windows, but modify the GUI by accessing ...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_pylab_with_gtk4_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_pylab_with_gtk4_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">pyplot with GTK4</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Demonstrate how to create an interactive histogram, in which bars are hidden or shown by clicki...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_svg_histogram_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_svg_histogram_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">SVG Histogram</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="This example shows how to create a tooltip that will show up when hovering over a matplotlib pa...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_svg_tooltip_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_svg_tooltip_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">SVG Tooltip</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="This example demonstrates how to">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_toolmanager_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_toolmanager_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Tool Manager</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="When using Matplotlib in a web server it is strongly recommended to not use pyplot (pyplot main...">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_web_application_server_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_web_application_server_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Embedding in a web application server (Flask)</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Example to draw a cursor and report the data coords in wx.">

.. only:: html

  .. image:: /gallery/user_interfaces/images/thumb/sphx_glr_wxcursor_demo_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_user_interfaces_wxcursor_demo_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Adding a cursor in WX</div>
    </div>


.. raw:: html

    </div>


.. toctree::
   :hidden:

   /gallery/user_interfaces/canvasagg
   /gallery/user_interfaces/embedding_in_gtk3_panzoom_sgskip
   /gallery/user_interfaces/embedding_in_gtk3_sgskip
   /gallery/user_interfaces/embedding_in_gtk4_panzoom_sgskip
   /gallery/user_interfaces/embedding_in_gtk4_sgskip
   /gallery/user_interfaces/embedding_in_qt_sgskip
   /gallery/user_interfaces/embedding_in_tk_sgskip
   /gallery/user_interfaces/embedding_in_wx2_sgskip
   /gallery/user_interfaces/embedding_in_wx3_sgskip
   /gallery/user_interfaces/embedding_in_wx4_sgskip
   /gallery/user_interfaces/embedding_in_wx5_sgskip
   /gallery/user_interfaces/embedding_webagg_sgskip
   /gallery/user_interfaces/fourier_demo_wx_sgskip
   /gallery/user_interfaces/gtk3_spreadsheet_sgskip
   /gallery/user_interfaces/gtk4_spreadsheet_sgskip
   /gallery/user_interfaces/mathtext_wx_sgskip
   /gallery/user_interfaces/mpl_with_glade3_sgskip
   /gallery/user_interfaces/mplcvd
   /gallery/user_interfaces/pylab_with_gtk3_sgskip
   /gallery/user_interfaces/pylab_with_gtk4_sgskip
   /gallery/user_interfaces/svg_histogram_sgskip
   /gallery/user_interfaces/svg_tooltip_sgskip
   /gallery/user_interfaces/toolmanager_sgskip
   /gallery/user_interfaces/web_application_server_sgskip
   /gallery/user_interfaces/wxcursor_demo_sgskip