Radial Slider

Who it’s for

Dashboard authors who need an operator to change a setpoint, not just read one, and who are asking “what is this device set to right now, and can I nudge it from here?” Typically a thermostat, a pump speed, a dimmer, a target pressure — anything where the value lives on the device as an attribute, the operator adjusts it a few times a day, and a text input would feel wrong next to the rest of the dashboard.

What it does

A boiler set to 22 shows a blue arc filled to just over two thirds of its travel with the number in the middle; drag the knob to 24 and the arc, the needle and the number move together, and one RPC command goes to the device when you let go.

• Drag anywhere on the knob — mouse, touch or pen — through a 270° travel; releasing sends the command
• The value and its units share one baseline and scale with the card, so the number stays readable from a wall display down to a small tile
• Minimum, maximum and step are either fixed numbers or read from device attributes, so a device can advertise its own safe range
• Opens on the device’s stored setpoint and range, read once at load, instead of waiting for the next update to arrive
• Optional on/off toggle that either writes a boolean attribute or sends its own separate RPC command
• One colour setting drives the arc, the needle, the value and the toggle; the unfilled part of the arc is the same colour at low opacity
• Snapping respects the configured step, so a dial with a step of 0.5 can never send 21.37
• Shows a single value at a time; it does not chart history, compare devices, or display more than one setpoint per card

How to set up

Select a Target device in the widget’s settings — that is the device the dial reads from and sends commands to. This widget has no data settings: instead of picking data keys, you name the attributes you want in the settings form.

Data keys

Key	Role	Type	Description
Value attribute (user-configured)	Current setpoint shown on the dial	Attribute	Numeric. Shared or server scope. Required for the dial to show a live value
State attribute (user-configured)	Current on/off state of the toggle	Attribute	Boolean. Accepts true/false or "true"/"false"
Minimum from attribute (user-configured)	Lower end of the dial’s travel	Attribute	Numeric. Optional — overrides the fixed Minimum once it arrives
Maximum from attribute (user-configured)	Upper end of the dial’s travel	Attribute	Numeric. Optional — overrides the fixed Maximum once it arrives
Step from attribute (user-configured)	Increment the dial snaps to	Attribute	Numeric, greater than zero. Optional — overrides the fixed Step

Every one of these is optional except the value attribute. The dial subscribes only to the attributes you actually name, so an unused row costs nothing.

When the widget loads it reads the current value of every attribute it was given, so the dial opens on the device’s real setpoint rather than at its minimum. This matters because a setpoint written days ago never gets pushed again by a live subscription — without the initial read, the dial would sit at zero until somebody changed the device. Attributes are looked up in client, shared and server scope, and for each key the most recently updated scope wins, so you never have to tell the widget where a value lives.

If an attribute has never been reported, the dial keeps the fixed number configured beside it rather than treating the gap as zero — a device that has not yet published its range still gets a usable dial. If no target device is selected, or no value attribute is named, the card says so inline instead of rendering an empty dial or a red error box. If the reported value falls outside the range, the card says that too, rather than silently pinning the needle at one end.

While a drag is in progress the device cannot pull the needle out from under the operator’s finger: incoming values are applied only once the gesture ends.

How to customize

• To change what the dial sends — set Method and Parameters under Command. {$value} in the JSON body is replaced with the dial value, so the device decides the key names: {"value": {$value}}, {"setpoint": {$value}}, {"level": "{$value}"}.
• To wait for the device to confirm — switch Mode to Two way. The card shows an inline message if the command is refused or times out.
• To let the device define its own range — fill in Minimum from attribute and Maximum from attribute and leave the fixed numbers as a fallback.
• To show fractional setpoints — raise Decimals and lower Step to match, e.g. 1 and 0.5.
• To change the units or move them — set Units, and switch Units position between Next to the value and Below the value. Leaving Units empty hides them.
• To recolour the whole dial — change the single Color setting under Appearance.
• To make the toggle send a command instead of writing an attribute — set Toggle action to Send an RPC command, then set Toggle method and Toggle parameters, where {$state} becomes true or false.
• To hide the toggle — turn off Show on/off toggle.
• To label the card — use the widget’s own Title in Appearance, and add Subtitle if you need a second line.

Tips

• Keep Step and Decimals on the same scale. A step of 0.5 with 0 decimals rounds 21.5 to 22 on screen while sending 21.5 to the device, which looks like the dial is lying.
• If the device also publishes its safe operating range, drive Minimum and Maximum from attributes rather than typing them in. The same dashboard then works across devices with different limits, and a firmware change to the range does not need a dashboard edit.
• Point the toggle’s State attribute at whatever the device reports even when Toggle action is Send an RPC command. The toggle then reflects the device’s real state instead of only remembering the last click.