Widget Guide

Electins menyediakan 18+ pilihan widget visualisasi dan pengontrol yang terbagi menjadi 3 kategori utama: Controllers, Displays, dan Charts. Setiap widget memiliki ukuran default grid dan konfigurasi parameter kustom.

1. Kategori Controllers (Pengontrol Perangkat)

Widget Type	Fungsi Utama	Default Size (W x H)	Mobile Size (W x H)	Properti Konfigurasi
switch	Sakelar Toggle ON/OFF Persisten	3 x 2 Grid	6 x 4 Grid	initialValue, trueLabel ("ON"), falseLabel ("OFF"), color
button	Tombol Momentary Trigger (Seketika)	3 x 2 Grid	6 x 4 Grid	color
push-button	ON saat ditekan, OFF saat dilepas	3 x 3 Grid	6 x 6 Grid	trueLabel ("ON"), falseLabel ("PUSH"), color
arc-slider	Slider Lengkung 270° dengan Tombol Center	4 x 4 Grid	10 x 10 Grid	min, max, initialValue, unit, color
slider	Slider Range Linier Horisontal	5 x 2 Grid	10 x 5 Grid	min, max, initialValue, unit, color
stepper-h	Pengubah Nilai Horisontal (− / val / +)	3 x 2 Grid	8 x 4 Grid	min, max, initialValue, step, unit, color
stepper-v	Pengubah Nilai Vertikal (+ / val / −)	2 x 3 Grid	4 x 8 Grid	min, max, initialValue, step, unit, color
color-picker	Pemilih Warna RGB / HEX Lampu LED	4 x 5 Grid	12 x 15 Grid	color (HEX)
time-picker	Pengatur Jam / Menit (Drum Scroll HH:MM)	4 x 4 Grid	10 x 9 Grid	color
text-input	Input Teks Bebas ke Perangkat	4 x 2 Grid	12 x 5 Grid	color, placeholder, inputType
voice	Pengenal Perintah Suara (Speech-to-Text)	5 x 5 Grid	6 x 6 Grid	color

2. Kategori Displays & Charts (Tampilan & Grafik)

Widget Type	Fungsi Visualisasi	Default Size (W x H)	Mobile Size (W x H)	Properti Konfigurasi
value	Tampilan Angka Digital Besar	3 x 2 Grid	6 x 4 Grid	unit, decimals (presisi), color
gauge	Speedometer Setengah Lingkaran Radial	4 x 4 Grid	10 x 10 Grid	min, max, unit, color
label	Teks Judul / Keterangan Statis	3 x 2 Grid	6 x 4 Grid	color
led	Lampu Indikator Status ON/OFF	3 x 2 Grid	6 x 4 Grid	trueLabel ("Active"), falseLabel ("Idle"), initialValue, color
v-level	Meteran Level Bar Vertikal (Tangki Air)	2 x 4 Grid	4 x 8 Grid	min, max, unit, color
h-level	Meteran Level Bar Horisontal	4 x 2 Grid	8 x 4 Grid	min, max, unit, color
line-chart	Grafik Tren Sensor Realtime Kontinu	6 x 4 Grid	12 x 8 Grid	min, max, unit, color
radial	Grafik Lingkaran Ring Persentase	4 x 4 Grid	10 x 10 Grid	min, max, unit, color
map	Pemetaan GPS OpenStreetMap Interaktif	6 x 6 Grid	18 x 14 Grid	color

Cara Mengubah Datastream Target Widget

1. Klik tombol Edit Dashboard pada Web Dashboard Studio.
2. Klik ikon Settings (Roda Gigi) pada widget yang ingin disesuaikan.
3. Isikan Kunci Topik Datastream target (misal: temp atau relay1).
4. Tentukan rentang batas minimum, maksimum, desimal, dan satuan unit (misal: °C, %, Volt).
5. Klik Simpan Perubahan.