Linked inputs: slider + number box + quick access buttons

Show and Tell
1

My first piece of reusable code in ObservableHQ.

I extended some of the ideas from linked-inputs from @mbostock and @severo (thanks!) and made a piece of reusable code for a multi-input.

Screen Shot 2021-01-24 at 9.55.27 AM
Screen Shot 2021-01-24 at 9.55.27 AM1056×291 43.3 KB

I needed something to allow a slider for a range (like 0 to 100), but also a box to allow a specific or larger number in a text box. And I wanted some quick selects for doubling, halving, and resetting.

Many thanks to Inputs / Jeremy Ashkenas | Observable and set_value from Inputs + setter / Sylvain Lesage | Observable and to these Linked Inputs / Mike Bostock | Observable and Synchronized Views / Mike Bostock | Observable

2 Likes
2

Excellent. If you paste the notebook link directly it will auto fill in a preview (I think you pasted a screenshot, and now I can’t easily find your notebook to upvote). See:

1 Like
3

Yes. Thanks! I left out the notebook link by accident. Fixing now.

4

This is now done with settable inputs. See

5 Likes