.. DO NOT EDIT.
.. THIS FILE WAS AUTOMATICALLY GENERATED BY SPHINX-GALLERY.
.. TO MAKE CHANGES, EDIT THE SOURCE PYTHON FILE:
.. "_gallery/feature_demo/scene_subplots_video.py"
.. LINE NUMBERS ARE GIVEN BELOW.

.. only:: html

    .. note::
        :class: sphx-glr-download-link-note

        :ref:`Go to the end <sphx_glr_download__gallery_feature_demo_scene_subplots_video.py>`
        to download the full example code.

.. rst-class:: sphx-glr-example-title

.. _sphx_glr__gallery_feature_demo_scene_subplots_video.py:


Subplots Video
==============

An example combining `synced_video.py` with subplots.
Double click to re-center the images.

.. GENERATED FROM PYTHON SOURCE LINES 8-107



.. image-sg:: /_gallery/feature_demo/images/sphx_glr_scene_subplots_video_001.webp
   :alt: scene subplots video
   :srcset: /_gallery/feature_demo/images/sphx_glr_scene_subplots_video_001.webp
   :class: sphx-glr-single-img





.. code-block:: Python



    from rendercanvas.auto import RenderCanvas, loop
    import pygfx as gfx
    import numpy as np

    canvas = RenderCanvas()
    renderer = gfx.renderers.WgpuRenderer(canvas)

    dims = (512, 512)  # image dimensions
    # default cam position
    center_cam_pos = (256, 256, 0)

    # colormaps for each of the 4 images
    cmaps = [gfx.cm.inferno, gfx.cm.plasma, gfx.cm.magma, gfx.cm.viridis]

    # lists of everything necessary to make this plot
    scenes = list()
    cameras = list()
    images = list()
    controllers = list()
    camera_defaults = list()
    viewports = list()

    for i in range(4):
        # create scene for this subplot
        scene = gfx.Scene()
        scenes.append(scene)

        # create Image WorldObject
        img = gfx.Image(
            gfx.Geometry(
                grid=gfx.Texture(np.random.rand(*dims).astype(np.float32) * 255, dim=2)
            ),
            gfx.ImageBasicMaterial(clim=(0, 255), map=cmaps[i]),
        )

        # add image to list
        images.append(img)
        scene.add(img)

        # create camera, set default position, add to list
        camera = gfx.OrthographicCamera(*dims)
        camera.show_rect(0, 512, 0, 512)
        cameras.append(camera)

        # create viewport for this image
        viewport = gfx.Viewport(renderer)
        viewports.append(viewport)

        # controller for pan & zoom
        controller = gfx.PanZoomController(camera, register_events=renderer)
        controllers.append(controller)

        # get the initial controller params so the camera can be reset later
        camera_defaults.append(camera.get_state())


    @renderer.add_event_handler("resize")
    def layout(event=None):
        """
        Update the viewports when the canvas is resized
        """
        w, h = renderer.logical_size
        w2, h2 = w / 2 - 15, h / 2 - 15
        viewports[0].rect = 10, 10, w2, h2
        viewports[1].rect = w / 2 + 5, 10, w2, h2
        viewports[2].rect = 10, h / 2 + 5, w2, h2
        viewports[3].rect = w / 2 + 5, h / 2 + 5, w2, h2


    def animate():
        for img in images:
            # create new image data
            img.geometry.grid.data[:] = np.random.rand(*dims).astype(np.float32) * 255
            img.geometry.grid.update_full()

        # render the viewports
        for viewport, s, c in zip(viewports, scenes, cameras, strict=True):
            viewport.render(s, c)

        renderer.flush()
        canvas.request_draw()


    def center_objects(ev):  # center objects upon double-click event
        for _con, cam, img in zip(controllers, cameras, images, strict=True):
            cam.show_object(img)


    renderer.add_event_handler(center_objects, "double_click")


    layout()


    if __name__ == "__main__":
        canvas.request_draw(animate)
        loop.run()


.. rst-class:: sphx-glr-timing

   **Total running time of the script:** (0 minutes 0.408 seconds)


.. _sphx_glr_download__gallery_feature_demo_scene_subplots_video.py:

.. only:: html

  .. container:: sphx-glr-footer sphx-glr-footer-example

    .. container:: sphx-glr-download sphx-glr-download-jupyter

      :download:`Download Jupyter notebook: scene_subplots_video.ipynb <scene_subplots_video.ipynb>`

    .. container:: sphx-glr-download sphx-glr-download-python

      :download:`Download Python source code: scene_subplots_video.py <scene_subplots_video.py>`

    .. container:: sphx-glr-download sphx-glr-download-zip

      :download:`Download zipped: scene_subplots_video.zip <scene_subplots_video.zip>`


.. only:: html

 .. rst-class:: sphx-glr-signature

    `Gallery generated by Sphinx-Gallery <https://sphinx-gallery.github.io>`_

.. only:: html

    Interactive example
    -------------------

    Try this example in your browser using Pyodide. Might not work with all examples and all devices. Check the output and your browser's console for details.

    .. raw:: html

        <iframe src="./../pyodide.html#scene_subplots_video.py"></iframe>