Membuat Grafik Bar dengan PHP


Copy code berikit dan Simpan file ini dengan nama class.wchar.php
<?php
  /*
  W.Chart By Stieven R. Kalengkian
  All Right Reserved 
  Copyright (c) 2008
  Free for Personal use
  */
  class wchart {
  var $kanvas;
  var $kanvas_width_master   = 400;
  var $kanvas_height_master   = 300;
  var $kanvas_free = 50;
  var $max_data = 5000;
  var $kanvas_legend_height = 100;
  var $kanvas_legend_width = 100;
  var $string_head = "Wow!! Chart";
  var $space = 15;
 function wchart($w,$h,$f=50,$m=5000,$g=10) {
  $this->kanvas_width_master = $w;
  $this->kanvas_height_master = $h;
  if ($f < 40) { $f = 40; }
  $this->kanvas_free = $f;
  $this->max_data = $m;
  $this->grid = $g;
  }
  
  function set_title($t) {
  $this->string_head=$t;
  $string_foot="Generated ".date("M, d Y h:i:sa")." GCM Graph";
  imagestring($this->kanvas,2,($this->kanvas_width_master-(strlen($string_foot)*6))/2,$this->kanvas_height_master-15,$string_foot,$this->dgrey);
  imagestring($this->kanvas,5,($this->kanvas_width_master-(strlen($this->string_head)*9))/2,15,$this->string_head,$this->black);
  }
  
  function make_kanvas() { 
  $this->kanvas = imagecreatetruecolor($this->kanvas_width_master+$this->kanvas_legend_width,$this->kanvas_height_master+$this->kanvas_legend_height);
  
  $this->kanvas_height = $this->kanvas_height_master - ($this->kanvas_free*2);
  $this->kanvas_width = $this->kanvas_width_master - ($this->kanvas_free);
  $this->start_x = $this->kanvas_free;
  $this->end_x = $this->kanvas_width;
  $this->start_y = $this->kanvas_free;
  $this->end_y = $this->kanvas_height;
  
  $this->red=imagecolorallocate($this->kanvas,0xFF,0x00,0x00);
  $this->black=imagecolorallocate($this->kanvas,0x00,0x00,0x00);
  $this->green=imagecolorallocate($this->kanvas,0x00,0xFF,0x00);
  $this->white=imagecolorallocate($this->kanvas,0xFF,0xFF,0xFF);
  $this->blue=imagecolorallocate($this->kanvas,0x00,0x00,0xFF);
  $this->grey=imagecolorallocate($this->kanvas,0xF6,0xF6,0xF6);
  $this->dgrey=imagecolorallocate($this->kanvas,0xCF,0xCF,0xCF);
  imagefill($this->kanvas,0,0,$this->white);
  imagerectangle($this->kanvas,1,1,$this->kanvas_width_master-1+$this->kanvas_legend_width,$this->kanvas_height_master-1+$this->kanvas_legend_height,$this->black);
  }
  
  function make_grid($g = 10) {
  $dataPersen = $this->max_data/$g;
  $maxPersen = $dataPersen*$g;
  $gridScale = round(($this->kanvas_height)/$g);
  for ($i = 0; $i <= $g; $i++) {
  imageline($this->kanvas,$this->start_x,$gridScale*$i+$this->kanvas_free,$this->end_x,$gridScale*$i+$this->kanvas_free,$this->grey);
  }
  
  $gs = round(($this->kanvas_width-$this->kanvas_free)/$g);
  $gridV = round(($this->kanvas_width-$this->kanvas_free)/$gs);
  for ($i = 0; $i <= $gridV; $i++) {
  imageline($this->kanvas,$this->start_x+$i*$gs,$this->start_y,$this->start_x+$i*$gs,$this->end_y+$this->kanvas_free,$this->grey);
  }
  imageline($this->kanvas,$this->start_x,round(($this->kanvas_height)/2)+$this->kanvas_free,$this->end_x,round(($this->kanvas_height)/2)+$this->kanvas_free,$this->dgrey);
  imageline($this->kanvas,$this->start_x,$this->end_y+$this->kanvas_free,$this->end_x,$this->end_y+$this->kanvas_free,$this->black);
  imageline($this->kanvas,$this->start_x,$this->start_y,$this->start_x,$this->end_y+$this->kanvas_free,$this->black);
  for ($i = 0; $i <= $g; $i++) {
  imagestring($this->kanvas,2,$this->start_x-($this->start_x-10),$gridScale*$i-5+$this->kanvas_free,round($maxPersen-($dataPersen*$i),2),$this->black);
  }
  }
  
  function polygon($arr,$filled = 0) {
  if ($filled == 0 ) {
  imagepolygon($this->kanvas,$arr,round(count($arr)/2),$this->red);
  } else {
  imagefilledpolygon($this->kanvas,$arr,round(count($arr)/2),$this->red);
  }
  }
  
  function bar($data,$text,$t3d=0) {
  $color[0]=imagecolorallocate($this->kanvas,0x00,0xFF,0x00);
  $color[1]=imagecolorallocate($this->kanvas,0xFF,0x00,0x00);
  $color[2]=imagecolorallocate($this->kanvas,0x00,0x00,0xFF);
  $color[3]=imagecolorallocate($this->kanvas,0x99,0x00,0x00);
  $color[4]=imagecolorallocate($this->kanvas,0x99,0x00,0x99);
  $color[5]=imagecolorallocate($this->kanvas,0xFF,0x66,0x00);
  $color[6]=imagecolorallocate($this->kanvas,0x33,0x33,0x00);
  $color[7]=imagecolorallocate($this->kanvas,0xFF,0x66,0x00);
  $color[8]=imagecolorallocate($this->kanvas,0x00,0x66,0x00);
  $color[9]=imagecolorallocate($this->kanvas,0xFF,0x66,0xFF);
  $color[10]=imagecolorallocate($this->kanvas,0x33,0x33,0xcc);
  if ($t3d == 1) { $this->bar3d($data,$text); }
  $space=$this->space;
  $jarak=round(($this->end_x-$this->kanvas_free-(count($data)*10))/count($data));
  $c=0;
  for ($i=0;$i<count($data);$i++) {
  $titik=round($data[$i]/$this->max_data*($this->end_y))-($this->kanvas_free);
  $x1 = $this->start_x+$space+($i*$jarak);
  $x2 = $x1+$jarak-$space;
  $y1 = $this->end_y-$titik;
  $y2 = $this->end_y+($this->kanvas_free-1);
  $tt=$data[$i];
  $tl=round(strlen($text[$i])*6)/2;
  $xt=$x1;
  if ($c > count($color)) { $c=0; }
  imagefilledrectangle($this->kanvas,$x1,$y1,$x2,$y2,$color[$c]);
  $string="$tt";
  if ($this->text_persen == 1) { $string="$tt%"; }
  //imagestring($this->kanvas,2,$x1+5,$y1-$space-30,$tt,$this->black);
  imagestring($this->kanvas,2,$xt+5,$y1-15-$space,$string,$this->black);
  $ls=10; $sp=5;
  $ly=$this->kanvas_height_master+($i*($ls+$sp));
  imagefilledrectangle($this->kanvas,$this->start_x,$ly,$this->start_x+10,$ly+$ls,$color[$c]);
  imagestring($this->kanvas,2,$this->start_x+20,$ly-1,$text[$i],$this->black);
  $c++;
  }
  }
  
  function bar3d($data,$text) {
  $color[0][0]=imagecolorallocate($this->kanvas,0x00,0x99,0x00);
  $color[0][1]=imagecolorallocate($this->kanvas,0x00,0x33,0x00);
  $color[1][0]=imagecolorallocate($this->kanvas,0x99,0x00,0x00);
  $color[1][1]=imagecolorallocate($this->kanvas,0x33,0x00,0x00);
  $color[2][0]=imagecolorallocate($this->kanvas,0x00,0x00,0x99);
  $color[2][1]=imagecolorallocate($this->kanvas,0x00,0x00,0x33);
  $color[3][0]=imagecolorallocate($this->kanvas,0x66,0x00,0x00);
  $color[3][1]=imagecolorallocate($this->kanvas,0x11,0x00,0x00);
  $color[4][0]=imagecolorallocate($this->kanvas,0x66,0x00,0x66);
  $color[4][1]=imagecolorallocate($this->kanvas,0x11,0x00,0x11);
  $color[5][0]=imagecolorallocate($this->kanvas,0x99,0x33,0x00);
  $color[5][1]=imagecolorallocate($this->kanvas,0x66,0x00,0x00);
  $color[6][0]=imagecolorallocate($this->kanvas,0x21,0x21,0x00);
  $color[6][1]=imagecolorallocate($this->kanvas,0x10,0x10,0x00);
  $color[7][0]=imagecolorallocate($this->kanvas,0x99,0x33,0x00);
  $color[7][1]=imagecolorallocate($this->kanvas,0x66,0x00,0x00);
  $color[8][0]=imagecolorallocate($this->kanvas,0x00,0x33,0x00);
  $color[8][1]=imagecolorallocate($this->kanvas,0x00,0x11,0x00);
  $color[9][0]=imagecolorallocate($this->kanvas,0x99,0x33,0x99);
  $color[9][1]=imagecolorallocate($this->kanvas,0x33,0x11,0x33);
  $color[10][0]=imagecolorallocate($this->kanvas,0x33,0x33,0xFF);
  $color[10][1]=imagecolorallocate($this->kanvas,0x00,0x00,0xCC);
  $space=$this->space;
  $p=$space-2;
  $jarak=round(($this->end_x-$this->kanvas_free-(count($data)*10))/count($data));
  $c=0;
  for ($i=0;$i<count($data);$i++) {
  $titik=round($data[$i]/$this->max_data*($this->end_y))-($this->kanvas_free);
  $x1 = $this->start_x+$space+($i*$jarak);
  $x2 = $x1+$jarak-$space;
  $y1 = $this->end_y-$titik;
  $y2 = $this->end_y+($this->kanvas_free-1);
  $tt=$data[$i];
  $tl=round(strlen($text[$i])*6)/2;
  $xt=$x1;
  if ($c > count($color)) { $c=0; }
  
  $point=array($x1,$y1,$x2,$y1,$x2+$p,$y1-$p,$x1+$p,$y1-$p);
  $numpoint=round(count($point)/2);
  imagefilledpolygon($this->kanvas,$point,$numpoint,$color[$c][0]);
  $point=array($x2,$y1,$x2+$p,$y1-$p,$x2+$p,$y2-$p,$x2,$y2);
  $numpoint=round(count($point)/2);
  imagefilledpolygon($this->kanvas,$point,$numpoint,$color[$c][1]);
  $c++;
  }
  }
  
  function cstring($x,$y,$string,$f=2) {
  imagestring($this->kanvas,$f,$x,$y,$string,$this->black);
  }
  
  function draw() {
  header("Content-type: image/png");
  imagepng($this->kanvas);
  }
  }
?>
Gunakan kode berikut untuk menggunakan class.wchart.php, tapi ingat jangan lupa include file terlebih dulu
<?php
include "class.wchart.php";
$data=array(100,50,20,30,50);
$text=array("satu","dua","tiga","empat","lima");
$chart = new wchart(600,300,40,100);
$chart->make_kanvas();
$chart->make_grid(10);
$chart->set_title("My Chart Demo for Me");
$chart->bar($data,$text);
$chart->draw();
?>

Komentar

  1. maaf mas mau nanya ...

    trus klo cara koneksiin ke database

    mysql nya gmn yah mas ...???

    ntu kan kita manual ...

    tapi klo make database ...

    gimana mas ...?

    BalasHapus
  2. 1. Konek to mysql
    2. query data di tabel
    3. Simpan data (array) ke variable $data
    4. modifikasi variable $text
    5. Buat skrip seperti contoh diatas


    < ?
    include "class.wchart.php";

    // diasumsikan $sql_result_array adalah nilai (dalam array) hasil query dari mysql
    $data=$sql_result_array;

    // Diasumsikan $text_result_array adalah text untuk grafik (lihat contoh diatas)
    $text=$text_result_array;

    $chart = new wchart(600,300,40,100);
    $chart->make_kanvas();
    $chart->make_grid(10);
    $chart->set_title("My Chart Demo for Me");
    $chart->bar($data,$text);
    $chart->draw();

    ? >

    BalasHapus
  3. makasih yah mas ...

    di coba dulu neh ...

    BalasHapus

Posting Komentar