Merge pull request #171 from haesleinhuepf/blend

Add blend and animate_blend

Author: haesleinhuepf

README.md

@@ -131,7 +131,7 @@ stackview.imshow(labels, plot=axs[2], alpha=0.4, title='image + labels')
 
 ### Static animations
 
-The `animate` and `animate_curtain` functions can be used to store animations of image stacks / images blended over each other as gif to disk.
+The `animate`, `animate_curtain` and `animate_blend` functions can be used to store animations of image stacks / images blended over each other as gif to disk.
 
 ```python
 stackview.animate(blobs_images, frame_delay_ms=50)
@@ -198,6 +198,17 @@ stackview.curtain(slice_image, labels)
 
 ![](https://raw.githubusercontent.com/haesleinhuepf/stackview/main/docs/images/demo_curtain3.gif)
 
+### Blend
+
+You can blend images interactively like this:
+
+```
+stackview.blend(image, label_image)
+```
+
+![](https://raw.githubusercontent.com/haesleinhuepf/stackview/main/docs/images/blend.gif)
+
+
 ### Side-by-side view
 
 A side-by-side view for colocalization visualization is also available.

docs/blend.ipynb

@@ -5,7 +5,7 @@
 
 setuptools.setup(
     name="stackview",
-    version="0.17.0",
+    version="0.18.0",
     author="Robert Haase",
     author_email="[email protected]",
     description="Interactive image stack viewing in jupyter notebooks",

docs/images/blend.gif

@@ -1,4 +1,4 @@
-__version__ = "0.17.0"
+__version__ = "0.18.0"
 
 from ._static_view import jupyter_displayable_output, insight
 from ._utilities import merge_rgb
@@ -16,7 +16,7 @@
 from ._switch import switch
 from ._colormaps import create_colormap
 from ._imshow import imshow
-from ._animate import animate, animate_curtain
+from ._animate import animate, animate_curtain, animate_blend
 from ._display_range import display_range
 from ._scatterplot import scatterplot
 from ._grid import grid
@@ -25,3 +25,4 @@
 from ._wordcloudplot import wordcloudplot
 from ._add_bounding_boxes import add_bounding_boxes
 from ._histogram import histogram
+from ._blend import blend

setup.py

@@ -1,4 +1,3 @@
-
 def animate(timelapse, filename:str=None, overwrite_file:bool=True, frame_delay_ms:int=150, num_loops:int=1000, colormap=None, display_min=None, display_max=None, zoom_factor:float=1.0):
     """
     Create an animated GIF from a list of 2D images and return it as Markdown object, that can be shown in Jupyter notebooks.
@@ -148,3 +147,82 @@ def animate_curtain(timelapse, timelapse_curtain,
         images.append(image_slice)
 
     return animate(np.asarray(images), filename=filename, overwrite_file=overwrite_file, frame_delay_ms=frame_delay_ms, num_loops=num_loops, zoom_factor=zoom_factor)
+
+def animate_blend(
+        image1,
+        image2,
+        num_steps: int = 20,
+        zoom_factor: float = 1.0,
+        colormap1: str = None,
+        display_min1: float = None,
+        display_max1: float = None,
+        colormap2: str = None,
+        display_min2: float = None,
+        display_max2: float = None,
+        filename: str = None,
+        overwrite_file: bool = True,
+        frame_delay_ms: int = 150,
+        num_loops: int = 1000
+):
+    """Create an animated GIF showing a smooth blend transition between two images.
+
+    Parameters
+    ----------
+    image1 : image
+        First image to blend
+    image2 : image
+        Second image to blend
+    num_steps : int, optional
+        Number of steps in the animation
+    zoom_factor : float, optional
+        Allows showing the image larger (> 1) or smaller (<1)
+    colormap1 : str, optional
+        Matplotlib colormap name or "pure_green", "pure_magenta", ... for first image
+    display_min1 : float, optional
+        Lower bound of properly shown intensities for first image
+    display_max1 : float, optional
+        Upper bound of properly shown intensities for first image
+    colormap2 : str, optional
+        Matplotlib colormap name or "pure_green", "pure_magenta", ... for second image
+    display_min2 : float, optional
+        Lower bound of properly shown intensities for second image
+    display_max2 : float, optional
+        Upper bound of properly shown intensities for second image
+    filename : str, optional
+        Name of the file where the animation will be saved
+    overwrite_file : bool, optional
+        Overwrite the file if it already exists. Default: True
+    frame_delay_ms : int, optional
+        Delay between frames in milliseconds
+    num_loops : int, optional
+        Number of loops in the animation
+
+    Returns
+    -------
+    An HTML object that can be displayed in a Jupyter notebook.
+    """
+    import numpy as np
+    from ._image_widget import _img_to_rgb
+
+    if 'cupy.ndarray' in str(type(image1)):
+        image1 = image1.get()
+
+    if 'cupy.ndarray' in str(type(image2)):
+        image2 = image2.get()
+
+    # Convert images to RGB
+    image1_rgb = _img_to_rgb(image1, colormap=colormap1, display_min=display_min1, display_max=display_max1)
+    image2_rgb = _img_to_rgb(image2, colormap=colormap2, display_min=display_min2, display_max=display_max2)
+
+    # Create frames with different blend factors
+    frames = []
+    for i in range(num_steps):
+        blend_factor = i / (num_steps - 1)
+        blended = (1 - blend_factor) * image1_rgb + blend_factor * image2_rgb
+        frames.append(blended.astype(np.uint8))
+
+    # Add reverse frames to create a smooth loop
+    frames.extend(frames[::-1])
+
+    return animate(np.asarray(frames), filename=filename, overwrite_file=overwrite_file,
+                  frame_delay_ms=frame_delay_ms, num_loops=num_loops, zoom_factor=zoom_factor)

stackview/__init__.py

@@ -0,0 +1,107 @@
+def blend(
+        image1,
+        image2,
+        slice_number: int = None,
+        axis: int = 0,
+        continuous_update: bool = True,
+        blend_factor: float = 0.5,
+        zoom_factor: float = 1.0,
+        zoom_spline_order: int = 0,
+        colormap1: str = None,
+        display_min1: float = None,
+        display_max1: float = None,
+        colormap2: str = None,
+        display_min2: float = None,
+        display_max2: float = None
+):
+    """Show two images blended together with a slider to control the blend factor.
+
+    Parameters
+    ----------
+    image1 : image
+        First image to blend
+    image2 : image
+        Second image to blend
+    slice_number : int, optional
+        Slice-position in case we are looking at an image stack
+    axis : int, optional
+        This parameter is obsolete. If you want to show any other axis than the first, you need to transpose the image before, e.g. using np.swapaxes().
+    continuous_update : bool, optional
+        Update the image while dragging the mouse, default: True
+    blend_factor: float, optional
+        Controls the blend between images (0 = only image1, 1 = only image2)
+    zoom_factor: float, optional
+        Allows showing the image larger (> 1) or smaller (<1)
+    zoom_spline_order: int, optional
+        Spline order used for interpolation (default=0, nearest-neighbor)
+    colormap1: str, optional
+        Matplotlib colormap name or "pure_green", "pure_magenta", ... for first image
+    display_min1: float, optional
+        Lower bound of properly shown intensities for first image
+    display_max1: float, optional
+        Upper bound of properly shown intensities for first image
+    colormap2: str, optional
+        Matplotlib colormap name or "pure_green", "pure_magenta", ... for second image
+    display_min2: float, optional
+        Lower bound of properly shown intensities for second image
+    display_max2: float, optional
+        Upper bound of properly shown intensities for second image
+
+    Returns
+    -------
+    An ipywidget with an image display and a slider.
+    """
+    import ipywidgets
+    from ._image_widget import ImageWidget
+    from ._slice_viewer import _SliceViewer
+    import numpy as np
+    from ._utilities import _no_resize
+    from ._uint_field import intSlider
+
+    if 'cupy.ndarray' in str(type(image1)):
+        image1 = image1.get()
+
+    if 'cupy.ndarray' in str(type(image2)):
+        image2 = image2.get()
+
+    # setup user interface for changing the blend factor
+    blend_slider = intSlider(
+        value=blend_factor,
+        min=0,
+        max=100,
+        continuous_update=continuous_update,
+        description="Blend"
+    )
+
+    viewer = None
+    from ._image_widget import _img_to_rgb
+
+    def transform_image():
+        image_slice1 = _img_to_rgb(viewer.get_view_slice(), colormap=colormap1, display_min=display_min1, display_max=display_max1).copy()
+        image_slice2 = _img_to_rgb(viewer.get_view_slice(image2), colormap=colormap2, display_min=display_min2, display_max=display_max2)
+        blend_value = blend_slider.value / 100
+        blended_image = (1 - blend_value) * image_slice1 + blend_value * image_slice2
+        return blended_image
+
+    viewer = _SliceViewer(image1, continuous_update=continuous_update, zoom_factor=zoom_factor,
+                          zoom_spline_order=zoom_spline_order, colormap=colormap1, display_min=display_min1,
+                          display_max=display_max1)
+
+    view = viewer.view
+    sliders = viewer.slice_slider
+
+    # event handler when the user changed something:
+    def configuration_updated(event=None):
+        view.data = transform_image()
+
+    configuration_updated(None)
+
+    # connect user interface with event
+    blend_slider.observe(configuration_updated)
+
+    # connect user interface with event
+    viewer.observe(configuration_updated)
+    result = _no_resize(ipywidgets.VBox([_no_resize(view), sliders, blend_slider]))
+    result.update = configuration_updated
+    result.viewer = viewer
+    return result