Langsung ke konten utama

Tutorial membuat histogram sederhana menggunakan d3js

    selain menggunakan tabelau kita juga bisa mengguakan library d3 pada bahasa pemrograman java script. untuk membuat nya kita harus menggunakan xampp atau live server yang merupakan add on di visual code.

langkah - langkah pembuatan:

1. Mencari Dataset
    Pada kali ini saya menggunkan dataset sebelumnya yang merupakan harga petrol atau bensin. Dataset berasal dari website tabelau linknya: https://www.kaggle.com/datasets/zusmani/petrolgas-prices-worldwide dataset ini pun saya edit. Kolom kedua nama kolom saya menghilangkan spasi dan kurung buka dan tutup agar bisa terdeksi oleh parser csv d3js. Kemudian saya menyisakan 10 baris dan 2 kolom saja agar tidak banyak.

2. Membuat File HTML dan folder
    Ketika sudah mengedit file csv kita akan membuat folder web dan membuat file HTML di dalam folder tersebut dan menaruh file csv yang sudah dieedit kedalam file tersebut.

3. Menuliskan Kode di Dalam File HTML
    a. pertama tama kita menuliskan doctype html, dan head html

    b. Kemudian kita menulis tag body dan tag script yang bersumberkan library d3js dan membuat tag div untuk mendeklarasikan dimana histogram kita akan divisualisasikan

    c. setelah itu kita menambahkan tag script untuk  menuliskan script java script kita dan tambahkan variabel margin untuk mengeset margin histogram

    d.  Kemudian menambahkan variable svg untuk mengappend kedalam tag div

    e.  Kemudian parse data csv kita menggunakan d3.csv("lokasi data csv") dan tambahkan axis x dan y. pada .domain pada x axis kita menuliskan d.namaKolomPertama pada file csv kalian.


    f. kemudian join data - data sebelumnya menggunakan svg.selectAll dan memvisualisasikannya di web pada .attribut x tuliskan d.kolomPertama, attribut y tuiliskan d.kolomKedua dan attribut height tuliskan d.kolomKedua sesuai kolom yang ada di file csv kalian



HASIL




Komentar

Posting Komentar

Postingan populer dari blog ini

Nilai Kebudayaan Sebagai Perekat Kesatuan Bangsa

  SEBAGAI tradisi, nilai-nilai luhur dan kearifan lokal yang dimiliki dan di hidupi bersama secara turun-temurun oleh suatu kelompok masyarakat tertentu dalam suatu bangsa, kebudayaan dapat dimaknai sebagai identitas kolektif atau jati diri suatu bangsa. Kebudayaan memiliki peran dan fungsi yang sentral dan mendasar sebagai landasan utama dalam tatanan kehidupan berbangsa dan bernegara karena suatu bangsa akan menjadi besar jika nilai-nilai kebudayaan telah mengakar (deep-rooted) dalam sendi kehidupan masyarakat. Indonesia sebagai negara kepulauan adalah negara-bangsa yang memiliki kekayaan dan keragaman budaya nusantara yang merupakan daya tarik tersendiri di mata dunia. Seharusnya hal ini dapat dijadikan modal untuk menaikkan citra bangsa di mata dunia sekaligus nilai-nilai fundamental yang berfungsi merekatkan persatuan.[1] Kita pun tentu nya mengetahui bahwa begitu beragam Budaya yang ada di Indonesia, terbentang mulai dari Sabang  sampai Merauke. mak...
Posting Komentar
Baca selengkapnya

Review Tableau

Nama : Ananda Wahidan Latif NPM : 10119690 Kelas : 3KA11 Tableau Public Merupakan sebuah software untuk mengelola data dan memvisualisasikan data secara mudah karena user interface yang mudah digunakan untuk orang awam. Kemudian tableau public bertujuan untuk meningkatkan transformasi data lebih fluid dan solid. Dapat mentransformasi data untuk mengambil makna yang lebih dalam dari data yang diolah. Tableau Software Inc. merupakan perusahaan yang membuat tableau, dan didirikan pada tahun 2003 di Mountain View, Calirfornia oleh Christian Chabot, Chris Stolte, Andrew Beers dan Pat Hanrahan . Mempunuyai pemasukan sekitar 5,873 juta dollar pada tahun (2017). Situs Resmi : https://www.tableau.com/products/trial Harga : $15 untuk Viewer, $42 untuk Explorer, $70 untuk creator. Masing – masing harga punya jangka waktu 1 bulan. Walaupun begitu ada versi gratisnya walaupun ada expired timenya yang hanya 14 hari. Daftar Fitur Utama: Data Blending Data Extraction Data Visualization Collaborative D...
Posting Komentar
Baca selengkapnya

Ilmu Pengetahuan Dan Kemiskinan

Definisi-definisi Ilmu pengetahun yang dalam bahasa Ingris disebut science merupakan pengetahuan yang tersusun dengan sistematis dengan menggunakan kekuatan pemikiran, pengetahuan mana selalu dapat diperiksa dan ditelaah dengan kritis oleh setiap orang lain yang ingin mengetahuinya. Teknologi adalah ilmu pengetahuan yang diterapkan ke dalam seni industri serta oleh karenanya mencakup alat-alat yang memungkinkan terlaksananya efisiensi tenaga kerja menurut keragaman kemampuan. (Abu Ahmadi,2009). Kemiskinan adalah suatu standar tingkat hidup yang rendah. (Suparlan, 1981). Ilmu Pengetahuan, Teknologi dan Kemiskinan Pada prinsipnya, ilmu pengetahuan dan teknologi merupakan dua hal yang mutlak dibutuhkan oleh seluruh umat manusia. Keduanya menjadi hal urgen untuk dimiliki. Hanya saja, dalam kontek dimana keduanya dihadapkan pada persoalan kemiskinan, pertanyaan yang mesti diajukan sebelumnya adalah adakah korelasi ilmu pengetahuan dan teknologi dengan kemiskinan...
Posting Komentar
Baca selengkapnya