Solara•3mo ago

How to make `slider.value` reactive?

Hi there! I have a notebook that contains two cells. I'd like to ask: How can I listen to changes in slider.value in the second cell? I don't want to modify the first cell. Suggestions are very welcome! Here's the notebook:

import ipywidgets as widgets
from IPython.display import display
slider = widgets.IntSlider( value=7, min=0, max=10, description='Slider:', continuous_update=False)
display(slider)

import ipywidgets as widgets
from IPython.display import display
slider = widgets.IntSlider( value=7, min=0, max=10, description='Slider:', continuous_update=False)
display(slider)

import solara
from matplotlib.figure import Figure
import numpy as np

@solara.component
def Page():
    fig = Figure()
    ax = fig.subplots()
    max_x = slider.value
    x = np.linspace(0, max_x, 100)
    y = np.sin(x)
    ax.scatter(x, y, color="green")
    return solara.FigureMatplotlib(fig)
Page()

import solara
from matplotlib.figure import Figure
import numpy as np

@solara.component
def Page():
    fig = Figure()
    ax = fig.subplots()
    max_x = slider.value
    x = np.linspace(0, max_x, 100)
    y = np.sin(x)
    ax.scatter(x, y, color="green")
    return solara.FigureMatplotlib(fig)
Page()

4 Replies

mariobuikhuizen•3mo ago

Hi @Jan-Hendrik Müller, you can replace silder.value with solara.use_trait_observe(slider, "value")

Jan-Hendrik Müller•3mo ago

Awesome, that works! 🎉

import solara
from matplotlib.figure import Figure
import numpy as np

@solara.component
def Page():
    fig = Figure()
    ax = fig.subplots()
    max_x = solara.use_trait_observe(slider, "value")
    x = np.linspace(0, max_x, 100)
    y = np.sin(x)
    ax.scatter(x, y, color="green")
    return solara.FigureMatplotlib(fig)
Page()

import solara
from matplotlib.figure import Figure
import numpy as np

@solara.component
def Page():
    fig = Figure()
    ax = fig.subplots()
    max_x = solara.use_trait_observe(slider, "value")
    x = np.linspace(0, max_x, 100)
    y = np.sin(x)
    ax.scatter(x, y, color="green")
    return solara.FigureMatplotlib(fig)
Page()

Jan-Hendrik Müller•3mo ago

mariobuikhuizen•3mo ago

nice!

Gaming

Programming

How to make `slider.value` reactive?