Komponen / Grafik & jadwal
HeatmapGrid
Matriks dua dimensi (skema × jenjang) dengan tiga tingkat warna dan angka di setiap sel; dirender sebagai <table> asli, sel bisa tautan.
Kapan dipakai
Gunakan
- Pakai untuk dua dimensi kategori dengan sedikit nilai per sel (≤ 4 × 6), mis. skema × jenjang, entitas × status.
- Selalu tulis angka di sel; warna hanya mempercepat pemindaian.
- Jelaskan ambang di subjudul kartu: "biru tua ≥ 2 · biru muda 1 · abu = kosong".
- Jadikan sel tautan ke daftar terfilter bila pengguna perlu menindaklanjuti.
Hindari
- Jangan memakai gradasi warna kontinu — tiga tingkat lebih mudah dibaca dan sesuai token.
- Jangan memakai HeatmapGrid untuk tren waktu panjang (12+ kolom) — pakai ColumnChart.
Contoh benar & salah
| Operasional | Support | |
|---|---|---|
| Staff | 3 | 1 |
| Officer | 0 | 1 |
| Section Head | 1 | 0 |
| Operasional | Support | |
|---|---|---|
| Staff | ||
| Officer | ||
| Section Head |
Penulisan
- Kepala kolom & baris memakai nama master persis: "Operasional", "Section Head".
- Subjudul kartu menyebut satuan dan arti warna.