2
1. Pendahuluan
Perkembangan teknik visualisasi data semakin berkembang mulai dari yang sederhana sampai yang kompleks.
Heatmap
merupakan salah satu teknologi visualisasi yang mempresentasikan data menggunakan gradien warna. Warna
yang biasa digunakan adalah merah, kuning, hijau, dan biru. Warna-warna tersebut mencerminkan banyak data dari yang terbanyak sampai paling sedikit
dengan urutan merah ke kuning ke hijau ke biru.
Heatmap
bisa digunakan untuk visualisasi data yang berbentuk 2-D dan 3-D.
Heatmap
2-D digunakan untuk membuat grafik berbentuk tabel untuk menyajikan data dalam baris dan kolom secara simultan. Selain berbentuk grafik
heatmap
2-D juga digunakan untuk membuat simulasi persebaran data.
Heatmap
3D digunakan untuk membuat grafik 3-D.
Heatmap
3-D juga bisa digunakan untuk membuat simulasi tekanan gelombang dan bisa juga digunakan untuk
membuat
surface plot
.
Heatmap
juga bisa digunakan untuk mengelompokkan data berdasarkan jumlah atau berdasarkan kerapatan dari kumpulan data. Kelebihan dari
heatmap
adalah
heatmap
dapat mengelompokkan data secara otomatis dari jumlah terbanyak sampai jumlah paling sedikit.
Heatmap
juga digunakan untuk mengoptimalkan kinerja iklan pada sebuah
website
dengan cara mendeteksi klik terbanyak pada sebuah halaman
web
[1]. Pengembang sering kesulitan bagaimana mereka dapat mempresentasikan
data yang besar dalam peta. Perkembangan teknologi
web browser
yang terus meningkat mempengaruhi jumlah
marker
yang bisa ditampilkan oleh
Maps API
, akan tetapi kepadatan
marker
yang berlebihan bisa membuat pengguna binggung. Jadi alternatifnya adalah menggunakan
heatmap
dan memungkinkan
browser
mengkorversi
heatmap
menggunakan
Maps API
dengan membuat
heatmap layer
baru.
Maps API
yang akan menentukan gradien warna, intensitas, dan perilaku
heatmap
ketika peta diperbesar [2][3]. Rumusan
masalah dalam
penelitian ini
adalah bagaimana
mengimplementasikan
heatmap
untuk menggambarkan pengelompokan data UKM di Salatiga. Pada penelitian ini
heatmap
digunakan sebagai media memberikan informasi persebaran UKM di Salatiga. Kelebihan
heatmap
bisa dilihat pada penelitian ini saat melakukan
zoom in
peta,
heatmap
akan semakin terpecah menjadi beberapa bagian, berubah bentuk serta perubahan intensitas
warna kemudian saat melakukan
zoom out
maka
heatmap
akan menyatu kembali, berubah bentuk menjadi lebih padat serta perubahan intensitas warna menjadi
lebih padat. Penggunaan
heatmap
ini diharapkan mampu memberikan informasi persebaran data UKM yang sudah dikelompokan berdasarkan kategori dan
wilayah. 2.
Tinjauan Pustaka
Penelitian tentang penggunaan
heatmap
sudah pernah dilakukan sebelumnya. Pada penelitian yang mengimplementasikan
heatmap
2-D untuk visualisasi data terdistribusi memanfaatkan
heatmap
digunakan untuk
3
mevisualisasikan data terdistribusi. Data terdistribusi adalah kumpulan data yang digunakan bersama-sama, dan didistribusikan melalui suatu jaringan komputer.
Teknologi
heatmap
pada penelitian ini digunakan untuk mevisualisasikan data terdistribusi agar lebih mudah dibaca dan lebih menarik. Dapat juga
mempermudah pengguna dalam mencari data dalam
database
XML, melihat tren yang ada di masyarakat, atau mengambil kesimpulan danatau keputusan
manajerial[4]. Pada penelitian yang mengimplementasikan teknologi
heatmap
sebagai alat untuk merekam posisi
click
pada suatu halaman
website
dan mencari posisi dimana
click
terbanyak yang terekam oleh
heatmap
. Data posisi akan digunakan untuk menentukan peletakan iklan supaya hasil yang didapat maksimal.
Heatmap
juga digunakan untuk menganalisis
area
rujukan untuk menu
hot
topik atau topik terhangat untuk mengoptimalkan kinerja
website
[1]. Penelitian sebelumnya yang juga membahas
heatmap
adalah penelitian yang memanfaatkan
heatmap
untuk merekam perilaku
user
dan aktifitas yang berkaitan dengan
interface website
tanpa menggunakan
hardware
khusus atau
software
yang mahal[5]. Pada penelitian tersebut
heatmap
digunakan untuk menampilkan data klik yang direkam dari sebuah
website
untuk menganalisa perilaku
user
yang mengunjungi
website
tersebut sehingga bisa disimpulkan
user interface
yang cocok untuk
website
tersebut.
Heatmap
merupakan representasi grafik dari data yang berisi matrik yang divisualisasikan menggunakan warna. Gradien warna default
heatmap
adalah merah, kuning, hijau, dan biru. Dari keempat warna tersebut akan ditemukan
warna dari percampuran dua warna sehingga menghasilkan warna baru. Menurut Tabel 1 kepadatan titik 80
– 100 akan divisualisasikan menggunakan warna merah. Kepadatan titik 70
– 80 akan divisualisasikan menggunakan warna coklat, warna coklat disini dihasilkan dari pencampuran warna merah dan kuning.
Kepadatan titik 60 – 70 akan divisualisasikan dengan warna kuning. Kepadatan
titik 50 – 60 akan divisualisasikan dengan warna hijau. Kepadatan titik 40 –
50 akan divisualisasikan dengan warna biru muda dan dibawah dari 40 akan divisualisasikan dengan warna biru. Semua warna tersebut bisa jadi tidak terlihat
pada
heatmap
yang muncul karena terpengaruh warna yang lebih dominan. Untuk lebih jelas bisa dilihat pada Gambar 1.
Tabel 1 Warna yang merepresentasikan kepadatan titik [1] Warna
Kepadatan titik
Merah 80
– 100 Coklat
70 – 80
Kuning 60
– 70 Hijau
50 – 60
Biru muda 40
– 50 Biru
Dibawah 40
4
100 80
70 60
50 40
Gambar 1 Jajaran warna yang digunakan Heatmap [1]
Satu titik
heatmap
memiliki koordinat X dan Y dalam kasus ini
Longitude
dan
Latitude
dari peta. Sebenarnya satu titik memiliki semua elemen warna
heatmap
. Bisa dilihat pada Gambar 2 dalam 1 titik
heatmap
memiliki semua elemen warna
heatmap
dari warna paling panas sampai warna paling dingin. Warna panas berada dititik tengah dan semakin menjauhi titik tengah
warna berubah menjadi semakin dingin.
Gambar 2 Contoh simpel 1 titik Heatmap [5]
Perbedaan penelitian ini dengan penelitian sebelumnya adalah aplikasi yang dibuat akan menerapkan
heatmap
pada pemetaan persebaran UKM yang memproduksi
makanan dan
minuman.
Heatmap
digunakan untuk
mevisualisasikan persebaran data UKM yang memproduksi makanan dan minuman agar lebih mudah dilihat seberapa luas persebaran UKM yang
memproduksi makanan dan minman di Salatiga.
5
3. Perancangan Sistem