Membuat Grafik Column Bar Dengan PHP Mengunakan Fusion Chart

Ukuran: px

Mulai penontonan dengan halaman:

Download "Membuat Grafik Column Bar Dengan PHP Mengunakan Fusion Chart"

Budi Lesmono
7 tahun lalu
Tontonan:

Membuat Grafik Column Bar Dengan PHP Mengunakan Fusion Chart Tyan Suhesti tyansuhesti30@yahoo.co.id :: http://tyansuhesti.blogspot.

1 Membuat Grafik Column Bar Dengan PHP Mengunakan Fusion Chart Tyan Suhesti :: Abstrak Seiring perkembangan teknologi yang maju, begitu pula cara penyajian data di promograman, termaksud PHP, tidak lagi hanya dapat di sajikan secara teks, tapi dapat juga di sajikan dalam berbentuk grafik dengan mengunakan plugins fusionchart. Kata Kunci: PHP, Pemograman, Grafik, Chart, Fusionchart Pendahuluan dibawah ini: Mungkin kita sering melihat penyajian data secara text, misalnya seperti Gambar 1

Nah, tentu dan bosan dengan penyajian data seperti tersebut, data yang di tampilkan secara teks kurang menarik dan agak lama untuk melihat kesimpulan data tersebut.

2 Nah, tentu dan bosan dengan penyajian data seperti tersebut, data yang di tampilkan secara teks kurang menarik dan agak lama untuk melihat kesimpulan data tersebut. Penulis ingin menbuat tutorial penajian data secara grafik menggunakan fusion chart, fungsi fusion chart disini tidak hanya dapat membuat grafik secara global column bar saja tapi juga bentuk lain, seperti, Diagram Pie, Line, Stake, Dashbord dan lain lain. Tetapi penulis hanya memberi contoh membuat grafik dengan column bar saja dan data yang di ambil dari database. Pembahasan Langkah pertama adalah membuat database dahulu: Saya asumsikan pembaca sudah mengerti membuat database Saya membuat table absen_guru dengan field id, nama_guru, tepat_waktu, tidak_tepat_waktu, dan saya isi seperti tampilan di bawah. Gambar 2

Table di atas hanya menjelaskan berapa kali guru tepat waktu dan tidak tepat waktu. Langkah kedua adalah mendownload plugins fusionchart di alamat, fusionchart.

3 Table di atas hanya menjelaskan berapa kali guru tepat waktu dan tidak tepat waktu. Langkah kedua adalah mendownload plugins fusionchart di alamat, fusionchart.com Maaf saya tidak menampilkan screenshotnya, karena penulis sedang tidak koneksi internet. Hehehe... (Maklum Mahasiswi lagi irit) Sebagai gantinya saya screen shot isi file fusionchart yg saya punya Gambar 3 Diatas adalah tampilan file fusionchart saya, gak usah lama lama lagi langsung ajah kita koding yuk!! Buat File Baru saya asumsikan kalian semua membuat file dengan nama index.php

4 index.php <?php /////Script Koneksi untuk Ke Database nama database tyan /////////// mysql_connect("localhost","root",""); mysql_select_db("tyan"); /////////////////////////////////////////////////////////////// ////////// Insert fungsi dari Fusion Chart /////////////////////// include "FusionCharts/class/FusionCharts_Gen.php"; include "FusionCharts/class/FusionCharts.php"; /////////////////////////////////////////////////////////////?> <html> <head> <title>absensi Presentasi Guru Raharja By Tyan Suhesti</title> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=utf-8"> <script language='javascript' src="fusioncharts/fusioncharts.js"></script> </head> Gambar 4

5 Script di atas adalah untuk membuat koneksi database dan dan insert fungsi yang di buat oleh fusionchart dan plugins fusion chartnya. Coding selanjutnya adalah <body> <table align="center"> <tr> <td> <?php $FC = new FusionCharts("Column3D","700","350"); # Setting Relative Path of chart swf file. $FC->setSwfPath("FusionCharts/"); # Store chart attributes in a variable $strparam="caption=grafik Presentasi Tepat Waktu Kehadiran Guru; xaxisname=nama Guru ;yaxisname=tepat Waktu; yaxismaxvalue=100; decimalprecision=0; showpercentvalues='100'; formatnumberscale=0; "; # Set chart attributes $FC->setChartParams($strParam); $sql = "SELECT * FROM absen_guru "; $result = mysql_query($sql); $num_rows = mysql_num_rows($result); if(mysql_num_rows($result) > 0){?> Gambar 5

6 Saya akan menjelaskan coding di atas $FC = new FusionCharts("Column3D","700","350"); Coding ini berfungsi untuk menetukan ukuran dan type grafik yang akan di tampilkan # Setting Relative Path of chart swf file. $FC->setSwfPath("FusionCharts/"); Script ini menentukan dimana file swfnya di simpan # Store chart attributes in a variable $strparam="caption=grafik Presentasi Tepat Waktu Kehadiran Guru; xaxisname=nama Guru ;yaxisname=tepat Waktu; yaxismaxvalue=100; decimalprecision=0; showpercentvalues='100'; formatnumberscale=0; "; Script ini untuk menentukan judul dan nama varibel lainnya sesuai dan tergantung kebutuhan. Gambar 6

7 Gambar 7 Selanjutnya saya akan menjelaskan gambar coding 6 dan 7 di atas Di Gambar 6 Itu seperti yang kalian mungkin sudah tahu adalah untuk coding membuat table, dan coding while($row = mysql_fetch_array($result)){ $nama_guru = $row['nama_guru']; $tepat_waktu = $row['tepat_waktu']; $tidak_tepat_waktu = $row['tidak_tepat_waktu']; $total_hadir = $tepat_waktu+$tidak_tepat_waktu; $fraction = $tepat_waktu/$total_hadir; $fraction_tidak_tepat_waktu = $tidak_tepat_waktu/$total_hadir; $percentage_tepat_waktu= round($fraction*100); $percentage_tidak_tepat_waktu= round($fraction_tidak_tepat_waktu*100); Dan coding di atas saya buat untuk menentukan varibel total hadir dan persentase tepat waktu dan tidak tepat waktu dalam persen Selanjutnya di Gambar 7 terdapat coding

$FC->addChartData("$percentage_tepat_waktu","name=$nama_guru"); Coding di atas adalah untuk membuat data di grafik $FC->renderChart(); Dan Coding renderchart adalah untuk menampilkan grafiknya

8 $FC->addChartData("$percentage_tepat_waktu","name=$nama_guru"); Coding di atas adalah untuk membuat data di grafik $FC->renderChart(); Dan Coding renderchart adalah untuk menampilkan grafiknya Jika Sudah Jadi Akan Terlihat Seperti Di Bawah ini : Sekian Tutorial Membuat Grafik Dengan PHP Mengunakan Fusion Chart Dari saya, terimakasih atas waktunya untuk membaca postingan saya. Penutup

Kesimpulan saya adalah, menampilkan data dengan grafik lebih menarik di bandingan hanya teks saja, dan juga dapat di jadikan sebagai alat untuk penunjang keputusan jiak mengunakan grafik dengan data

9 Kesimpulan saya adalah, menampilkan data dengan grafik lebih menarik di bandingan hanya teks saja, dan juga dapat di jadikan sebagai alat untuk penunjang keputusan jiak mengunakan grafik dengan data yang tepat. Untuk Source codenya mungkin nanti bisa saya upload Terima Kasih :D Referens Biografi Nama Saya Tyan Suhesti, saya tinggal di jatake, saya anak ke 2 dari 3 bersaudara.saya lulusan SMK BHAKTI ANINDYA, sekarang saya kuliah di PERGURUAN TINGGI RAHARJA angkatan 2011 Jurusan Sistem Informasi Manajemen, hobi saya baca buku, browsing internet.

dokumen-dokumen yang mirip

Membuat Grafik dengan FusionCharts Menggunakan Php dan Mysql

Membuat Grafik dengan FusionCharts Menggunakan Php dan Mysql Bayu Lesmana Putra bayu.lesmana@raharja.info Abstrak FusionCharts merupakan sebuah komponen atau library chart yang bersifat open source dan