Lompat ke isi
CirccaHIG

Komponen / Grafik & jadwal

ChartCard

Wadah kartu grafik di Monitoring: judul (pertanyaan kartu), keterangan, tautan ke daftar sumber, grafik, dan footnote penjelas — lengkap dengan keadaan kosong dan memuat. KpiCard untuk angka "x dari y" dengan ring kecil.
React · BetaFigma · siapFigmaSumber

Kapan dipakai

Gunakan

  • Pilih jenis grafik dari pertanyaan kartu, bukan disamakan: komposisi status → donut + angka tengah; beberapa cakupan terhadap populasi sama → ActivityRings; tren periode → ColumnChart; peringkat → BarList.
  • Tulis judul sebagai pertanyaan yang dijawab ("Status orang di PE") dan keterangan sebagai cara membaca angka ("Satu orang = hasil cek paling berat").
  • Beri tautan kanan ke daftar sumber agar angka bisa ditindaklanjuti.
  • Data semua-nol → empty dengan kalimat yang menyebut apa yang kosong; satu nilai saja → angka besar + daftar, bukan grafik.
  • KpiCard untuk "x dari y" (cakupan populasi); StatCard untuk angka dengan tren dibanding periode.

Hindari

  • Jangan menggambar grafik datar/nol — itu keadaan kosong.
  • Jangan menambah KPI dekoratif atau ring tanpa populasi yang jelas.
  • Jangan menaruh penjelasan arti kategori di judul; taruh di footnote.

Contoh benar & salah

Tunjangan tidak tetap

Belum ada baris musiman

Semuanya 0 periode ini.

GunakanData semua-nol diganti pesan kosong yang menyebut apa yang nol.

Tunjangan tidak tetap

0
0
0
HindariGrafik tetap digambar dengan semua batang/segmen nol.

Slip draf

5

dari 6 orang di PE

GunakanRing kecil menunjukkan cakupan nyata: 5 dari 6 orang.

Total gaji

Rp 1,2 M

periode Okt 2026

HindariRing penuh hiasan pada angka tanpa populasi.

Penulisan

  • Judul kata benda singkat yang menyebut populasi dan ukuran: "Status orang di PE", "Bekal slip draf".
  • Tautan memakai nama daftar tujuan: "Payroll Entry", "Daftar Karyawan" — tanda › ditambahkan otomatis.
  • Footnote menjelaskan definisi, bukan mengulang angka: "Menahan = SSA atau rekening belum ada."
  • Pesan kosong menyebut apa yang kosong dan apakah wajar: "Belum ada baris musiman" + "semuanya 0 periode ini".

Komponen terkait

Esc
↑↓ pilih↵ buka12 hasil