

.. _sphx_glr_gallery_widgets:

Widgets
=======

Examples of how to write primitive, but GUI agnostic, widgets in
matplotlib



.. raw:: html

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

.. thumbnail-parent-div-open

.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Display a data cursor including a text box, which shows the plot point close to the mouse pointer.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_annotated_cursor_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_annotated_cursor.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Annotated cursor</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Constructing a simple button GUI to modify a sine wave.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_buttons_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_buttons.py`

.. raw:: html

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


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Turning visual elements on and off with check buttons.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_check_buttons_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_check_buttons.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Check buttons</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Cursor">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_cursor_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_cursor.py`

.. raw:: html

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


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Interactively selecting data points with the lasso tool.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_lasso_selector_demo_sgskip_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_lasso_selector_demo_sgskip.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Lasso Selector</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Using texts to construct a simple menu.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_menu_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_menu.py`

.. raw:: html

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


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="This example sets an alternative cursor on a figure canvas.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_mouse_cursor_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_mouse_cursor.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Mouse Cursor</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Showing a cursor on multiple plots simultaneously.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_multicursor_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_multicursor.py`

.. raw:: html

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


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Shows how one can select indices of a polygon interactively.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_polygon_selector_demo_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_polygon_selector_demo.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Select indices from a collection using polygon selector</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Shows how to create a polygon programmatically or interactively">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_polygon_selector_simple_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_polygon_selector_simple.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Polygon Selector</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Using radio buttons to choose properties of your plot.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_radio_buttons_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_radio_buttons.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Radio Buttons</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Using the RangeSlider widget to control the thresholding of an image.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_range_slider_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_range_slider.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Image scaling using a RangeSlider</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="Click somewhere, move the mouse, and release the mouse button. RectangleSelector and EllipseSelector draw a rectangle or an ellipse from the initial click position to the current mouse position (within the same axes) until the button is released.  A connected callback receives the click- and release-events.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_rectangle_selector_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_rectangle_selector.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Rectangle and ellipse selectors</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="In this example, sliders are used to control the frequency and amplitude of a sine wave.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_slider_demo_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_slider_demo.py`

.. raw:: html

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


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="You can snap slider values to discrete values using the valstep argument.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_slider_snap_demo_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_slider_snap_demo.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Snap sliders to discrete values</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="The SpanSelector is a mouse widget that enables selecting a range on an axis.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_span_selector_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_span_selector.py`

.. raw:: html

      <div class="sphx-glr-thumbnail-title">Span Selector</div>
    </div>


.. raw:: html

    <div class="sphx-glr-thumbcontainer" tooltip="The Textbox widget lets users interactively provide text input, including formulas. In this example, the plot is updated using the on_submit method. This method triggers the execution of the submit function when the user presses enter in the textbox or leaves the textbox.">

.. only:: html

  .. image:: /gallery/widgets/images/thumb/sphx_glr_textbox_thumb.png
    :alt:

  :ref:`sphx_glr_gallery_widgets_textbox.py`

.. raw:: html

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


.. thumbnail-parent-div-close

.. raw:: html

    </div>


.. toctree::
   :hidden:

   /gallery/widgets/annotated_cursor
   /gallery/widgets/buttons
   /gallery/widgets/check_buttons
   /gallery/widgets/cursor
   /gallery/widgets/lasso_selector_demo_sgskip
   /gallery/widgets/menu
   /gallery/widgets/mouse_cursor
   /gallery/widgets/multicursor
   /gallery/widgets/polygon_selector_demo
   /gallery/widgets/polygon_selector_simple
   /gallery/widgets/radio_buttons
   /gallery/widgets/range_slider
   /gallery/widgets/rectangle_selector
   /gallery/widgets/slider_demo
   /gallery/widgets/slider_snap_demo
   /gallery/widgets/span_selector
   /gallery/widgets/textbox

