Belajar BI Analyst - Advanced Visualization (D3 & Embedded)

#Pendahuluan

Semua visual yang kalian bangun sejauh ini memakai chart standar: bar, line, pie, scatter. Episode ini membuka kemungkinan di luarnya: custom visualization dengan D3, embedded analytics yang menyematkan dashboard ke aplikasi produk, dan interactive storytelling yang mengubah data menjadi pengalaman. Ini adalah level di mana BI mulai terasa seperti "produk".

Mengapa ini penting? Karena tidak semua pertanyaan bisa dijawab chart standar — dan karena BI modern semakin menjadi fitur produk, bukan hanya internal tools. Perusahaan menanamkan analitik ke aplikasi pelanggan mereka; kalian perlu tahu kapan ini layak dan bagaimana membangunnya dengan benar.

#Kapan Custom Visualization Diperlukan

Chart standar menutup sekitar 90% kebutuhan BI. Custom visual layak ketika:

Sebaliknya, jangan custom hanya untuk "terlihat keren". Prinsip episode 7 tetap berlaku: visual harus memperjelas data, bukan memamerkannya.

#D3.js: Fondasi Custom Visualization

D3 (Data-Driven Documents) adalah library JavaScript untuk membangun visualisasi berbasis data — dengan kontrol penuh atas DOM dan SVG. Ini bukan dashboard tool; ini toolkit untuk membangun visual.

Struktur dasar visual D3:

<svg id="chart" width="400" height="200"></svg>

import * as d3 from "d3"
 
const data = [
    { region: "West", revenue: 120 },
    { region: "East", revenue: 95 },
    { region: "Central", revenue: 80 }
]
 
const svg = d3.select("#chart")
const scale = d3.scaleBand()
    .domain(data.map(d => d.region))
    .range([0, 380])
    .padding(0.2)
 
svg.selectAll("rect")
    .data(data)
    .enter()
    .append("rect")
    .attr("x", d => scale(d.region) ?? 0)
    .attr("width", scale.bandwidth())
    .attr("height", d => d.revenue)
    .attr("fill", "steelblue")

Konsep kunci D3 yang wajib dipahami:

Kurva pembelajarannya cukup curam, tetapi hasilnya sangat fleksibel. Untuk BI Analyst, tujuan realistisnya bukan "jago D3", melainkan memahami kemampuannya dan bisa mengintegrasikan custom visual ke tool (misalnya Power BI Custom Visual atau Tableau Extension API).

#Embedded Analytics

Embedded analytics = menyematkan dashboard/report ke dalam aplikasi produk — pengguna aplikasi melihat analitik tanpa pindah tool. Contoh nyata: aplikasi kasir yang menampilkan dashboard penjualan, SaaS yang menampilkan usage analytics ke pelanggannya.

Alur embed pada umumnya:

Tiga pertimbangan utama embedded analytics:

1. Autentikasi: pengguna aplikasi ≠ pengguna BI. Gunakan token yang disesuaikan (mis. Power BI embed token, Looker embed secret) — jangan bagikan kredensial BI mentah.
2. RLS per pengguna: setiap pengguna aplikasi harus melihat datanya sendiri (episode 18) — embed token menyandang identitas pengguna, bukan identitas aplikasi.
3. Performa: dashboard embedded harus cepat — caching dan query ringan (episode 24).

Tool BI besar menyediakan SDK: Power BI Embedded, Tableau Embedding API, Looker Embed SDK. Konsepnya sama: aplikasi meminta token, SDK merender dashboard, dan keamanan dijaga token + RLS.

#Interactive Storytelling

Level tertinggi visualisasi: interactive storytelling — memandu pembaca melewati narasi data dengan interaksi, seperti artikel data journalism (New York Times, The Pudding).

Pola yang umum:

Prinsip narasinya sama dengan episode 11 (setup → konflik → aksi), bedanya medium: pembaca terlibat aktif. Untuk BI Analyst, interactive storytelling paling berguna untuk presentasi eksekutif dan publikasi insight penting — bukan untuk dashboard operasional harian.

#Praktik: Viz Custom di Tool BI

Coba mulai dari yang ringan — custom visual di dalam tool yang sudah kalian pakai:

Praktik 1 (Power BI):
- Coba chart dari AppSource (mis. Sankey, Sunburst, Radar)
- Pelajari cara impor custom visual → kuasai kapan perlu custom
 
Praktik 2 (Tableau):
- Buat visual canggih tanpa kode: waterfall chart, dual-axis combo
- Eksplorasi Tableau Extension API untuk visual D3
 
Praktik 3 (Konsep embedded):
- Pelajari dokumentasi embed tool pilihan kalian
- Buat sketsa: "dashboard apa yang bisa disematkan ke aplikasi demo?"

Sasarannya bukan menyelesaikan semuanya — melainkan menumbuhkan naluri: visual apa yang mungkin, kapan layak, dan bagaimana membangunnya bekerja sama dengan developer (untuk D3/embed, kalian akan sering kolaborasi dengan frontend engineer).

#Kesalahan Umum Advanced Visualization

• Custom visual demi gaya: prinsip kejelasan data dikorbankan untuk estetika.
• Over-engineering: membangun D3 custom padahal fitur tool sudah cukup.
• Embed tanpa security: token bocor → seluruh data aplikasi terlihat.
• Storytelling tanpa validasi data: narasi indah di atas angka yang belum diperiksa.
• Interaksi membingungkan: pengguna tidak tahu harus klik apa — visual canggih tapi tidak bisa dipakai.

#Penutup

Inti yang harus dibawa pulang:

• Custom visual (D3) hanya layak ketika chart standar tidak menjawab pertanyaan.
• Embedded analytics menyematkan dashboard ke aplikasi — jaga autentikasi token dan RLS per pengguna.
• Interactive storytelling mengubah data menjadi pengalaman naratif untuk presentasi penting.
• Mulai dari fitur bawaan tool; D3/embed adalah level lanjutan dengan kolaborasi developer.
• Praktik: eksplorasi custom visual di tool BI + sketsa konsep embedded analytics.

Di episode 24 selanjutnya kita akan membahas performance tuning BI — optimasi query, incremental refresh, dan caching untuk menjaga dashboard tetap cepat. Visual yang indah tidak ada gunanya jika loading-nya 2 menit. Pastikan tetap semangat!