LIVE WEB PLAYER
Loading WebAssembly…See it respond.
The same raylib runtime, compiled to WebAssembly. Load this example, inject MQTT messages and watch its published events.
MQTT I/O
Waiting for runtime…
The browser requires a user action before the scene is loaded. Click Load demo scene first. MQTT is emulated and never leaves this page. Shaders are disabled in the web build; GPIO is hardware-only.
Circular multi-ring progress display with central text and optional subtext.
Configuration
| Field | Description |
|---|---|
type | round_progress (roundprogress alias) |
value | Initial 0..1 or 0..100 value |
progress_field | Value property in JSON payloads |
text, subtext | Centre labels |
show_percent | Draw percentage automatically |
font, font_size, subtext_size | Font settings |
color, text_color, subtext_color | Foreground colours |
track_outer_color, track_middle_color, track_inner_color | Track rings |
core_color | Centre fill |
Copy-and-paste JSON
{
"type": "round_progress",
"id": "oxygen",
"pos": [680, 470],
"size": [220, 220],
"font": "_decterm.ttf",
"font_size": 24,
"subtext_size": 18,
"value": 75,
"text": "OXYGEN",
"subtext": "NOMINAL",
"show_percent": true,
"color": "#5CFF9DFF",
"text_color": "#8DFFB6FF",
"subtext_color": "#78FFA8FF",
"track_outer_color": "#26322BFF",
"track_middle_color": "#1A241EFF",
"track_inner_color": "#121814FF",
"core_color": "#0A100DFF",
"layer": 2
}MQTT
ergs/rpi01/update/oxygen 82
ergs/rpi01/cmd/oxygen/text OXYGEN
ergs/rpi01/cmd/oxygen/subtext NOMINAL
ergs/rpi01/cmd/oxygen/color #5CFF9D