About pluto sliders and documentation

Is there a formal description of the @bind command somewhere. I want to put labels before and after the slider …

Slider Label: …slider… Units label

e.g.,

Battery power: … MW
Battery energy: … MWh

I’m mainly just coding using examples … which are fine for the basics, but sometimes you need details and my julia reading skills are still a bit basic :slight_smile:

1 Like

I’m not sure how to place labels after the slider, but you can place a label before the slider with the following:

# cell 1
using PlutoUI

# cell 2
x = @bind x Slider(1:100, show_value = true)

The result is:

1 Like

You can combine Sliders with markdown, so your example would look something like:

md"""
Battery power: $(@bind x Slider(1:100, show_value = true)) MW

Battery energy: $(@bind y Slider(1:100, show_value = true)) MWh
"""

This binds battery power to x and battery energy to y

2 Likes

Wonderful. That’s perfect.

I’m still looking for detailed documentation of “tricks” like this … otherwise I need to pick up the magick one trick at a time :slight_smile:

1 Like

Here is another way, leveraging the Unitful.jl package

using Unitful
using PowerSystemsUnits
Battery_Power = @bind x Slider(1u"MW":0.5u"MW":100u"MW", show_value = true)
Battery_Energy = @bind y Slider(1u"MWh":1u"MWh":100u"MWh", show_value = true)
2 Likes

I put it in a markdown table to make it look better (just like the good old web 1.0 days).

md"""
| Option         | Value                                       | Units |
|----------------|---------------------------------------------|-------|
| Battery power  | $(@bind x Slider(1:100, show_value = true)) | MW    |
| Battery energy | $(@bind y Slider(1:100, show_value = true)) | MWh   |
"""
1 Like

I’d recommend taking a look at the featured notebooks, specifically the one about interactivity might be useful to you:

2 Likes