Bab II Desain Pemodelan Grafik

BAB II

TEORI TENTANG KONSEP VISUALISASI

2.1      BUBBLE CHART

2.1.1    PENGERTIAN

Bubble Chart adalah tipe grak yang memberikan tampilan 3 dimensi dari data yang berbentuk gelembung. Grak gelembung adalah variasi dari grak scatter chart dimana titik data diganti dengan gelembung dan dimensi tambahan dari data yang dipresentasikan dalam ukuran gelembung. Grak gelembung tidak menggunakan kategori sumbu-sumbu horizontal dan vertikal yang merupakan sumbu nilai. Bubble chart menggunakan sistem koordinat kartesian oat point sepanjang grid dimana sumbu x dan sumbu y adalah variabel terpisah namun tidak seperti scatter plot, masing-masing titik diberi label atau kategori. setiap titik di plot merupakan variabel ketiga dengan luas lingkaran tersebut. Warna juga dapat digunakan untuk membedakan antara kategori atau digunakan untuk mewakili variabel data tambahan. Waktu dapat ditampilkan baik dengan memiliki variabel data ataupun data yang berubah dari waktu ke waktu.

Bubble Chart biasanya digunakan untuk membandingkan dan menunjukkan hubungan antara label atau lingkaran yang dikategorikan, dengan menggunakan posisi dan proporsi. Gambaran keseluruhan dari bubble chart dapat digunakan untuk menganalisa pola atau

korelasi.

Terlalu banyak bubble dapat membuat grak sulit dibaca, sehingga bubble chart memiliki kapasitas ukuran data yang terbatas. Hal ini dapat diperbaiki dengan interaktivitas (mengklik diatas gelembung untuk menampilkan informasi tersembunyi, yang memiliki opsi untuk mengatur ulang atau menyaring kategori yang di kelompokkan). Bubble Chart umumnya digunakan dalam peta dan x/y-axis plot atau tanpa plot samasekali, Bubble Chart menampilkan atau menggambarkan hitungan baku, frekuensi, atau beberapa proporsisi variable dimana ukuran Bubble mencerminkan kuantitas. Warna Bubble Chart dapat mewakili kategori lebih lanjut dari variable grak yang dibuat, hal tersebut juga memungkinkan untuk menambah dimensi lain dengan menunjukkan pergerakan gelembung yang terjadi dari waktu-kewaktu (disebut sebagai diagram gerak).

2.1.2    TIPE-TIPE BUBBLE CHART

Dalam bentuk paling dasar, gelembung dengan ukuran terbesar menunjukkan nilai yang lebih besar. Penempatan gelembung pada sumbu X dan Y axis memberikan informasi tentang apa yang dijelaskan oleh gelembung tersebut. Grak ini menunjukkan panjang investasi (X-axis), dan harga pada saat pembelian(Y-axis) dan ukuran relatif investasi saat ini.

Gambar 1 Bubble plot 2.

Kode warna pada Bubble plot menggunakan warna untuk memilah gelembung dalam beberapa kategori. Sebagai contoh, pada gambar dibawah ini kita akan mengurutkan grak investasi ke saham, obligasi dan reksa dana .

Gambar 2 Bubble chart 3

Sebuah kartogram adalah gelembung plot yang telah diaplikasikan kedalam peta dunia, dimana sumbu X dan Y axis adalah bujur dan lintang. Ukuran gelembung biasanya menunjukkan tentang populasi, jumlah sumber daya, peristiwa cuaca alam, atau beberapa jenis data geogras yang lain.

Gambar 3 Kartogram

Grak terkadang dibagika dalam dimensi, dibawah ini adalah pembagian Grak dalam bentuk dimensi:

Grak dua dimensi, hanya memiliki nilai X dan nilai Y saja. Dan setara dengan scatter plot.

Grak tiga dimensi, memiliki nilai X dan nilai Y dan memiliki ukuran gelembung.

Grak empat dimensi, memiliki nilai X dan nilai Y, memiliki ukuran gelembung dan memiliki warna.

2.1.3 PENERAPAN BUBBLE CHART DALAM DUNIA

BISNIS

Bubble chart yang sering digunakan didalam dunia bisnis untuk memvisualisasikan hubungan antara proyek atau investasi alternatif dalam dimensi, seperti biaya, nilai dan resiko. Dengan memvisualisasikan portofolio proyek menggunakan bubble chart, anda dapat menemukan kelompok proyek yang relatif menarik dalam suatu bidang grak seperti daerah yang bernilai tinggi, berbiaya rendah dan beresiko rendah juga. Dibandingkan dengan proyek-proyek yang relatif kurang menarik dalam area grak yang berbeda, seperti daerah yang bernilai rendah, berbiaya tinggi dan beresiko tinggi.

Gambar 1 menggambarkan tentang hubungan antara keuntungan(YAxis), biaya(X-Axis), dan keuntungan ( % ).

Gambar 2 sama seperti gambar 1 tetapi ukuran variabel gelembungnya telah dihapuskan sehingga berubah menjadi scatter chart. Dalam contoh grak gelembung diatas kuadran yang paling diinginkan berada pada bagian kiri atas gambar(keuntungan yang lebih tinggi dan biaya yang lebih rendah) dan kuadran yang paling tidak diinginkan berada pada bagian kanan bawah gambar ( keuntungan rendah dan biayanya tinggi). Gelembung dengan daerah yang lebih besar memiliki peluang keberhasilan yang lebih tinggi. Seperti yang anda lihat, belajar portofolio proyek dibeberapa chart gelembung menggunakan dimensi yang berbeda dari hubungan bisnis dapat sangat membantu dalam membuat keputusan berbisnis.

2.1.4    PEMBUATAN BUBBLE CHART

Untuk membuat bubble chart, anda setidaknya harus menyertakan setidaknya 1 atribut dan 3 matrix di grid laporan anda. Dimana anda menempatkan setiap objek pada grid laporan mempengaruhi bagaimana benda ditampilkan dalam grak yang dihasilkan, sebagai berikut:

Matrix pertama di grid menentukan apa yang ditempatkan pada sumbu x.

Matrix kedua di grid menentukan apa yang ditempatkan pada sumbu y.

Matrix ketiga di grid menentukan ukuran setiap gelembung.

2.2      GEOCHART

2.2.1    PENGERTIAN

Data statistik wilayah biasa ditampilkan pada peta. Berbagai media digunakan untuk menempatkan peta itu, baik lewat kertas, gambar, atau web. Tampilan peta dalam web tentu diharapkan tidak statis tetapi cukup interaktif bagi yang melihat. Sudah banyak cara yang tersedia untuk menampilkan data wilayah di web. Salah satu caranya adalah memanfaatkan Geo Chart milik/layanan Google (Visualization API). Chart ini bisa menampilkan data dari tingkat benua, negara, provinsi/region, hingga kota, tanpa harus.

Berpusing ria dengan letak bujur lintang wilayah tersebut. Tinggal memanfaatkan ID wilayah yang terdaftar pada ISO 3166-1 alpha-

2. Layanan ini berupa Javascript.Sebuah Geochart memungkinkan anda untuk melakukan plot data geogras pada peta. warna yang digunakan untuk mewakili data, dengan warna yang lebih gelap mewakili jumlah yang lebih tinggi. Geo chart biasanya digunakan untuk menampilkan data penjualan (atau keuntungan) dalam suatu wilayah. meskipun geochart menyajikan data pada map, tapi geochart tetaplah merupakan sebuah chart bukan map.

GeoChart juga diketahui dengan Geographical chart karena Geo adalah kependekan dari Geographical, dengan Geo chart kita bisa merepresentasikan banyak tipe data seperti kepadatan daerah , populasi suatu area dan juga lainnya. Jadi fungsi utama dari Geochart adalah merepresentasikan suatu area dengan spesikasinya sendiri. kita juga bisa membandingkan dua daerah atau lebih dengan menggunakan geochart. Salah satu sifat penting dari geochart adalah itu tidak perlu di drag dan di scroll untuk berpindah dari geochart suatu tempat ke tempat yang lainnya.

Sebuah Geo Chart dalam suatu browser menggunakan SVG atau VML. Geo chart bukan scrollable maupun draggable, melainkan sebuah gambar berupa garis dari suatu peta medan.

2.2.2      PEMROGRAMAN YANG DIGUNAKAN DALAM GEOCHART

Salah satu program yang umum digunakan dalam Geochart adalah Google Maps API. Google Maps merupakan bentuk layanan peta online dari Google yang menawarkan teknologi pemetaan yang didapat dari gambar satelit untuk seluruh dunia, yang menggunakan layanan berbasis peta lainnya seperti Google Ride Finder, Google Transit, dan peta yang dimasukkan dari website pihak ketiga melalui Google Maps API. Google Maps menggunakan varian proyeksi Mercator sehingga tidak dapat secara akurat menunjukkan daerah disekitar. Aplikasi mobile Google Maps merupakan salah satu aplikasi popular, dengan lebih dari 54% dari pemilik smartphone yang menggunakannya. Google Maps pertama dijalankan sebagai program C++ yang di desain oleh Lars dan Jens Rasmussen. Pada Oktober 2004, perusahaan mereka diakuisisi oleh Google dan mengubah program tersebut menjadi aplikasi web Google Maps. Google Maps mempunyai platform open source sehingga dapat digunakan dengan bebas namun harus memenuhi syarat yang telah diterapkan. Google Maps juga memberikan kebebasan kepada pengembang untuk mengembangkan teknologi pemetaan yang berbasis Google Maps, sehingga dapat memperkaya tur yang sebelumnya ada pada Google Maps. Untuk pengembangan ini, Google mempunyai 2 pilihan platform, yaitu Open Source Platform (gratis) dan Entreprise Platform (berbayar). Dalam hal ini pengembangan platform Google Maps menggunakan sebuah bahasa pemrograman yang dinamakan dengan Maps API Java Script Programming yang khusus digunakan dalam pemetaan menggunakan Google Maps.

Selain Google Maps API, ada juga Google Sheet. Google Sheet memiliki berbagai jenis chart yang bisa kita gunakan dan juga dengan penggunaan yang terbilang mudah juga. sehingga sebagian pengguna bisa memasangnya pada. Kelebihan dari Google Sheet ini adalah, program ini bisa melakukan update secara otomatis dalam websitenya

2.2.3    MODE DALAM GEOCHART

Geochart adalah peta negara, benua atau daerah (Grak yang berbentuk peta) yang diidentikasikan dalam 3 cara:

Mode wilayah ditandai dengan memberi warna pada seluruh daerah seperti kota, provinsi, negara dan benua. mode wilayah dalam Google Maps API terbilang cukup ketat, karena Google perlu untuk mengetahui batas yang tepat dari negara atau wilayah yang kita inginkan. Singkatnya, mode wilayah bisa menggunakan nama negara atau nama wilayah

Mode penanda, menggunakan lingkaran untuk menunjukkan daerah yang diberi tingkatan sesuai dengan nilai yang ditentukan. Mode penanda di Google Sheet akan melakukan geocode dari alamat yang dicari. secara umum, mode penanda bekerja sangat baik apabila kita memasukkan informasi sejelas mungkin dalam Google Sheet. semakin spesik informasi yang kita masukkan semakin baik juga hasil yang didapatkan dari Google Sheet.

Mode teks yang menandakan daerah atau daerah yang spesik dengan label atau nama (’Rusia’ atau ’Asia’).

2.2.4    PILIHAN MEWARNAI GEOCHART

Ada beberapa pilihan untuk mengubah warna geochart:

ColorAxis: Spektrum warna yang akan digunakan untuk daerah pada table data.

BackgroundColor: Warna latar belakang untuk grak yang akan dibuat.

DatalessRegionColor: Warna untuk menetapkan ke daerah tanpa data yang terkait.

defaultColor: Warna untuk menetapkan ke daerah dalam table data yang nilainya baik nol atau tidak ditentukan.

Pilihan ColorAxis adalah hal yang terpenting, karena itu menentukan rentang warna untuk nilai data anda. Dalam array ColorAxis elemen pertama adalah warna yang diberikan pada nilai terkecil didalam dataset, dan elemen terakhir adalah warna yang diberikan dengan nilai yang terbesar dalam nilai dataset anda. Jika anda menentukan lebih dari dua warna, interpolasi akan terjadi diantara mereka.

2.3      ANNOTATION CHART

2.3.1    PENGERTIAN

Annotation chart adalah objek user-dened atau pembentukan gambar dalam chart. Annotation chart terkadang diharuskan untuk membuat interpretasi dari grak yang mudah digunakan untuk user. Ada 2 jenis annotation chart yang disediakan yaitu line dan bar. Dengan annotation chart memungkinkan pengguna untuk menaruh beberapa data tambahan yang tersedia dalam grak. Annotation chart berbeda dengan chart lainnya, karena pada annotation chart penjelasan yang ditentukan dalam kolom table data terletak terpisah, dan ditampikan bit sebagai teks singkat yang pengguna dapat melihat teks penjelasan secara lengkap. Sebaliknya, anotasi chart menampilkan anotasi penuh pada sisi kanan.

Memvisualisasikan data dari waktu ke waktu menggunakan grak garis dengan anotasi untuk memberikan wawasan titik data. Annotation chart adalah waktu interaktif line chart dengan anotasi penuh yang dapat dilihat dalam sisi visual.

Annotation chart adalah bagian juga dari Google chart tools untuk waktu yang terbilang cukup lama dan juga termasuk dalam bagian googleVis juga. namun dalam sekarang ini hanya beberapa versi yang ada dalam Google chart tools

fungsi annotation chart adalah dengan menyediakan cara sederhana untuk menambahkan komentar dan warna titik data individual dalam grak anda. Misalnya, anda dapat dengan mudah menyortir titik-titik tertentu di scatter plot ataupun bisa digunakan dengan

menabahkan lambang bintang

Annotation chart dihasilkan atau dibuat dengan menggunakan SVG/VML yang merupakan line chart yang juga menyediakan juga sarana untuk membuat annotation dan digunakan untuk menampilkan waktu yang interaktif. berikut adalah beberapa cara untuk membuat annotation chart:

AXIS MARKER

SERIES MARKER

HORIZONTAL/VERTICAL LINES

2.3.2    FORMAT DATA YANG YANG DIDUKUNG

Time series data tanpa anotasi.

Time series data dengan anotasi dan judul anotasi serta teks yang ditambahkan setelah data telah ada.

Time series data dengan anotasi dan judul anotasi serta teks yang dimasukkan jika ada data yang relevan.

2.3.3 METODE DALAM MENAMBAHKAN ANNOTA-

TION

Ada dua metode yang bisa kita gunakan untuk menambahkan, menghapus dan memodikasi anotasi:

setAnnotation(array): Mengatur susunan dari annotation yang sedang ditampilkan dan memperbaharui dari annotation yang sebelumnya telah kita buat.

annotations: mengembalikan array ke anotation yang sedang dijalankan.

2.3.4    FORMAT DATA ANNOTATION

Anda dapat menampilkan satu atau lebih baris pada tabel anda. Setiap baris mewakili posisi X pada tabel yaitu, waktu spesik, setiap baris dijelaskan oleh satu set satu sampai tiga kolom.

Kolom pertama adalah tanggal jenis atau date time, dan menentukan nilai X dari titik pada grak,. Jika kolom ini adalah tipe tanggal ( dan bukan date time) maka waktu terkecil resolusi pada sumbu X akan menjadi salah satu hari.

setiap baris data kemudian dijelaskan oleh satu set kolom tambahan.

nilai Y yang merupakan kolom pertama disetiap set menggambarkan nilai garis diwaktu yang sesuai dari kolom pertama. label kolom ditampilkan pada grak sebagai judul baris

Tittle penjelasan jika kolom string yang mengikuti kolom nilai dan pilihan display annotation benar, kolom ini memegang gelar singkat yang menjelaskan hal ini. misalnya, jika baris merupakan suhu di Brazil dan titik merupakan angka yang sangat tinggi, judulnya menjadi Hottest day on record.

Annotation text, jika kolom string kedua ada untuk saat ini, nilai set akan digunakan sebagai text deskriptif tambahan untuk titik ini. Anda harus mengatur display annotation pilihan untuk menggunakan kolom ini dengan benar. Anda dapat menggunakan tag HTML, jika anda menetapkan allowHTMLtrue, pada dasarnya tidak ada batas ukuran, tetapi catatan bahwa entri terlalu panjang mungkin melewati bagian layar. Anda tidak diharuskan memilki kolom ini bahkan jika anda memilki kolom judul penjelasan untuk hal ini. Label kolom tidak digunakan oleh grak. misalnya, jika ini adalah hari terpanas pada titik catatan anda mungkin akan mengatakan sesuatu seperti next closest day was ten degrees cooler.