Is there a way to build dependent sliders with PlutoUI?

Question

Is there a way to build dependent sliders with PlutoUI.jl in which adjusting one will dynamically change the others?

PlutoUI works by emitting Javascript code. I am not sure if the feature you seek has been implemented in Javascript. I would probably ask about this in the Javascript forums and (if there is such a widget in Javascript libraries available) then see if PlutoUI could use it. — Bill, Jul 11 '22 at 23:13
Javascript can definitely do this. So can Pluto, but only one direction — Ted Dunning, Jul 14 '22 at 23:29

score 1 · Answer 1 · answered Aug 04 '22 at 17:50

You can simply display the slider multiple times in different cells. These are the same sliders, thus adjusting it in one cell will adjust it also in all other cells.

Example:

# ╔═╡ 84fc2e80-141d-11ed-272a-13a267f5233a
using PlutoUI

# ╔═╡ 2538ee5d-6bd0-48f4-a5d3-fd0084a6a136
a = @bind x Slider(1:10)

# ╔═╡ 50e6b255-26c8-40c9-a5e5-0d95df73d3e6
a

# ╔═╡ 43ccffd4-e721-42b8-b9d3-8cbffcbedec3
x

This is useful when you need the same UI element at multiple places in your notebook for didactic / usability purposes.

Assigning the slider to a variable does the trick! – bert Jun 19 '23 at 05:30 — bert, Jun 19 '23 at 05:30

score 0 · Answer 2 · answered Jul 15 '22 at 00:05

Here is something that you can try:

using PlutoUI
a = @bind n1 PlutoUI.Slider(0:100)
b = @bind n2 PlutoUI.Slider(0:100, default=n1, show_value=true)

What happens with this is that whenever you change slider a, that causes b to be recreated (that's the way that Pluto works). The default setting is linked to the value of a so moving a causes b to appear to move. You can still re-adjust b to anything you like.

Note that you can't inter-link these two sliders because all cells in Pluto have an order of evaluation with no cycles.

Is there a way to build dependent sliders with PlutoUI?

2 Answers2