Membuat grafik batang sederhana menggunakan JpGraph

Ukuran: px

Mulai penontonan dengan halaman:

Download "Membuat grafik batang sederhana menggunakan JpGraph"

Hendri Tanudjaja
7 tahun lalu
Tontonan:

1 Membuat grafik batang sederhana menggunakan JpGraph Tutorial ini saya buat dengan bentuk script php yang disertai komentar dan penjelasan. Untuk lebih mudah mempelajari tutorial ini, disarankan menyalin kode php ini ke editor seperti notepad++, textpad atau editor html atau php agar lebih mudah untuk membedakan antara kode dengan baris komentar. Catatan. Tanda // berarti kalimat atau tulisan setelahnya merupakan komentar yang tidak mempengaruhi output. <?php // kita beri nama file php ini dengan nama latihan1.php //1. dasar dari semua fungsi jpgraph adalah meng-include-kan file jpgraph.php include ("inc/jpgraph.php"); //2. kemudian kita include-kan file fungsi grafik sesuai yang kita inginkan. pada latihan kali ini kita menggunakan grafik batang sederhana, kita menggunakan file jpgraph_bar.php include ("inc/jpgraph_bar.php"); //3. inputan data $datay=array(12,8,19,3,10,5); //4. ini adalah fungsi untuk meng-create- grafik. dua baris kode di bawah ini hampir pasti akan selalu kita gunakan untuk membuat grafik dengan jpgraph. // Pada bagian ini, terdapat 3 parameter yang harus kita isi pada baris kode $graph = new Graph(300,200,"auto");. Inputan pertama merupakan lebar dalam pixel (disini saya isi 300), kedua tinggi, ketiga adalah format gambar. disini saya mengisi "auto". auto berarti jpgraph akan menggunakan format terbaik diantara 3 pilihan, yaitu png, jpg atau gif. tetapi sepertinya gif tidak lagi disuport pada jpgraph terbaru, katanya sih masalah legal atau lisensi. Entahlah?... Jika kita ingin menggunakan format yang kita inginkan, kita bisa menghilangkan parameter auto, dan menambahkan kode $graph -> img-> SetImgFormat("format"); di bawah kode 4.1. format yang bisa kita pakai adalah png, jpg, gif $graph = new Graph(300,250,"auto");

2 $graph->setscale("textlin"); //5 kode ini untuk memberi efek shadow pada gambar, jika kita hilangkan tidak akan berpengaruh besar pada grafik $graph->setshadow(); //6 kode berikut untuk memberi margin grafik pada gambar yang kita buat. parameter sesuai urutan kanan, kiri, atas, bawah. terkadang lebih baik margin kita biarkan secara default, tetapi untuk pengaturan yang lebih baik dan rapi kita bisa menentukan margin sendiri $graph->img->setmargin(40,30,30,40); //7 membuat batang baru $bplot = new BarPlot($datay); //8 menentukan warna batang. disini saya set default, coba anda hilangkan tanda // ddepan kode untuk mengubah batang menjadi berwarna biru //$bplot->setfillcolor('blue'); // untuk kode dibawah ini, silahkan anda coba hilangkan // didepannya anda akan menemukan sesuatu yang lain. just try it. //$bplot->setwidth(1.0); //9 memasukkan batang ke dalam gambar $graph->add($bplot); //10 set judul dan style nya, disini saya memberi warna hitam(dimana jika warna tidak diset warna hitam adalah defaultnya. hilangkan tanda // pada baris ketiga untuk memberi warna biru pada judul grafik. $graph->title->set("diagram batang sederhana"); $graph->title->setfont(ff_arial,fs_bold); //$graph->title->setcolor("blue");

3 //11 menentukan tulisan yang akan muncul di bawah dan di samping grafik. title untuk sumbu x dan sumbu y dan stylenya $graph->xaxis->title->set("data"); $graph->yaxis->title->set("nilai"); $graph->yaxis->title->setfont(ff_arial,fs_normal); $graph->xaxis->title->setfont(ff_arial,fs_normal); //13 menampilkan gambar, gambar tidak akan muncul apabila kita tak menyertakan kode di bawah ini $graph->stroke(); // oh ya, sebagai tambahan, nama file gambar grafik yang kita buat akan sesuai dengan nama file php kita ini. //untuk menampilkan gambar ini pada file html atau php lain, kita cukup menggunakan tag <img scr="nama file grafik"> seperti kita menampilkan gambar biasa.?> Untuk menampilkan grafik yang telah kita buat pada halaman html atau php, kita bisa menggunakan tag <img scr= > seperti apabila kita ingin menampilkan gambar pada halaman html atau php. Berikut ini contoh kode html yang menampilkan grafik yang telah kita buat. <html> <head> <title>menampilkan gambar latihan1</title> </head> <body> <div align="center"> <b>ini jika ditampilkan dengan halaman html</b><br /><br /> <img src="latihan1.php" /> </div> </body> </html>

4 Catatan. File latihan1.php (file untuk membuat grafik) harus satu folder dengan file html ini. Beriku ini screenshot (karena tanpa skrinsyut berarti hoax????) dari grafik yang telah kita buat. Hasil grafik dari file latihan1.php

5 Tampilan pada halaman html

dokumen-dokumen yang mirip

A.Firmansyah

Manipulasi Grafik dalam PHP dengan JPGraph A.Firmansyah xenin3@yahoo.co.id Lisensi Dokumen: Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan