Web developer

Adi Prasetyo

Statistik dan visualisasi data

31 Aug 2016

Visualisasi data statistik penduduk indonesia menggunakan d3js

Kali ini kita akan belajar d3js v4 untuk menampilkan data, atau lebih tepatnya untuk memvisualisakikannya. Data yang akan kita gunakan diperoleh dari BPS (Badan Pusat Statistik), lebih spesifiknya dapat dilihat disini

Untuk menggunakan d3js kita perlu mengubah format data dari excel ke csv, hal tersebut dapat dicapai menggunakan OpenOffice yang merupakan open source. Dengan melakukan export file ke csv.

Dari data yang didapatkan, data sudah diklasifikasikan sesuai dengan pendidikan tertinggi yang ditamatkan. Maka kita akan tampilkan visualisasi untuk setiap kalsifikasinya untuk menampilkan perbandingan ankatan kerja dan bukan angkatan kerja sesuai pendidikan tertinggi yang ditamatkan. Dari perbandingan ankatan kerja dan bukan angkatan kerja yang ada masih digolongkan lagi lebih spesifik, kita akan memberikan interactify pada chart yang ada sesuai data yang ada. Diharapkan kita lebih mengerti detail data tersebut.

Pendidikan terkahir Tidak/ belum pernah sekolah Tidak/ belum tamat SD SD SLTP SMU SMK Akademi/ Diploma Universitas
Bulan
Februari Agustus
Tahun 2008 2009 2010 2011 2012 2013 2014 2015

Cukup memakan waktu membuat visualisasi diatas, mungkin karena skill programming yang belum mumpuni. Ditambah baru pertama kali memakai d3.js . Namun saya pribadi juga belum merasa mendapatkan insight jika hanya melihat grafik diatas. Teringat konsep DNS bahwa adanya DNS dikarenakan otak manusia lebih mudah menghafal kata dari pada angka. Senada ketika melihat tabel statistik tersebut, mari kita coba menampilkannya dengan pack layout dan masih dengan lingkaran kita akan memakai circle packing.

Tahun 2008 2009 2010 2011 2012 2013 2014 2015

Terakhir kita akan gunakan line chart agar dapat fokus melihat perubahan data dari tahun ke tahun. Line chart sesuai untuk menampilkan perkembangan data dari waktu ke waktu maupun kurun waktu tertentu. Dan lazimnya line chart menampilkan sisi kronologis. Untuk tampilan pertama kita hanya akan menampilkan data x, karena kita menggunakan HTML dan d3js kita akan memberikan pilihan agar data dapat di tampilkan secara keseluruhan. Terlepas dari data yang diminati untuk dilihat, nantinya data dapat ditampilkan sesuai data yang diminati melalui form dibawah.

Total Angkatan Kerja
Angkatan Kerja
Total Bukan Angkatan Kerja
Bukan Angkatan Kerja

Setelah berhubungan lansung dengan d3.js, SVG dan Statistika, tak terelakkan lagi bahwa matematika itu penting. Dari dasar SVG membuat segiempat , lingkaran, jarak antar element hingga bentuk-bentuk tingkat lanjut lainnya semua menggunakan perhitungan matematika. Semua titik yg ada di grafik diatas menggunakan SVG dan perhitungan metematika. Sekarang baru saya sadari bahwa ketika ada siswa/ pelajar yang mengeluh tentang sulitnya matematika seharusnya ia berfokus pada seberapa bermanfaatnya dia nanti ketika dapat mengimplementasikan matematika bukannya berfokus pada betapa sukarnya mempelajari matematika.