Making Scikit-Image interactive

Motivated by this tweet https://twitter.com/driscollis/status/1457362125802938370?s=20 I just wanted to showcase how you can easily make scikit-image interactive with Panel and HoloViews

Below an app is shown. It works just as well in a notebook

scikit-image-tinting

The app can be served via panel serve name_of_script.py.

from skimage import data
from skimage import color
from skimage import img_as_float
import holoviews as hv
import panel as pn

pn.extension(sizing_mode="stretch_width")

grayscale_image = img_as_float(data.camera()[::2, ::2])
image = color.gray2rgb(grayscale_image)
def tint(red=1, green=1, blue=1):
    return hv.RGB([red, green, blue]*image)

red = pn.widgets.FloatSlider(value=1, start=0, end=1, name="Red")
green = pn.widgets.FloatSlider(value=0.5, start=0, end=1, name="Green")
blue = pn.widgets.FloatSlider(value=0.5, start=0, end=1, name="Blue")

tint = pn.bind(tint, red=red, green=green, blue=blue)

pn.template.FastListTemplate(
    site="Awesome Panel",
    title="Tinting gray-scale images with Scikit-Image",
    sidebar=["# 🎨 Colors", red,green,blue],
    main=[
        pn.Column("# Before", pn.panel(hv.RGB(image))),
        pn.Column("# After", pn.panel(tint, sizing_mode="stretch_both")),
    ],
    accent_base_color="#ff286e", header_background="#ff286e"
).servable()
5 Likes

Here are links to Panel and HoloViews.

This is another example

import holoviews as hv
import panel as pn
from skimage import data, filters

pn.extension(sizing_mode="stretch_width")


image = data.coins()
edges = filters.sobel(image)

pn.template.FastListTemplate(
    site="Awesome Panel",
    title="Finding Edges with Scikit-Image",
    main=[
        pn.Column("# Before", hv.Image(image)),
        pn.Column("# After", hv.Image(edges)),
    ],
    accent_base_color="#2522CA", header_background="#2522CA"
).servable()

@MarcSkovMadsen This is great! Do you think you can fix the aspect ratio of the image display on the right? I think this would be a good example to add to our gallery, if you can programmatically create those screenshots.

1 Like

Yes. Should I make a Feature Request and PR to get it in?

I’ve created a Feature Request here Add example of scikit-image interactive tool build using Panel and HoloViews to the docs · Issue #6023 · scikit-image/scikit-image (github.com)

Thanks for that! Yes, I think a PR would get you there the quickest. How easy is it to generate a static screenshot from HoloViews for the gallery?

1 Like

Hi @stefanv

If what you are asking for is how easy it is to save the transformed image then its pretty easy. I’ve added a download button to the example. Check out Add example of scikit-image interactive tool build using Panel and HoloViews to the docs · Issue #6023 · scikit-image/scikit-image · GitHub