PDA

View Full Version : Making Bar Chart


Amisha_Sharma
11-06-2008, 06:31 AM
Hi to all out there

I want to make a barchart using PHP.but i need your help because i dont know the way of doing this.

Thanks
pghcollectibles
11-06-2008, 08:06 AM
i am making this up as i go but i can think of two quick ways:

1. you could use tables like this:

first you would make some css to define color and or width for your bars, then the chart...


<table cellspacing='5' cellpadding='0' border='0' width='100' height='100'>
<tr><td valign='bottom'>// or align='left' to do a horizontal chart

<table border='0'><tr><td class='blue' height='27' width='10'></td></tr></table>//insert a table with height defined for your bar length and width for your bar width
<table border='0'><tr><td class='green' height='83' width='10'></td></tr></table>//or width for your bar length and height for your bar width if making a horizontal chart
<table border='0'><tr><td class='red' height='54' width='10'></td></tr></table>
<table border='0'><tr><td class='orange' height='73' width='10'></td></tr></table>
<table border='0'><tr><td class='yellow' height='44' width='10'></td></tr></table>

</td></tr></table>
2. that should work but maybe isnt as neat as it would be if you used gd functions (http://us3.php.net/manual/en/ref.image.php):

make a blank picture, --- imagecreate()
(http://us3.php.net/manual/en/function.imagecreate.php)draw your lines, --- imageline()
(http://us3.php.net/manual/en/function.imageline.php)output picture to page. --- imagegif() (http://us3.php.net/manual/en/function.imagegif.php) or imagejpeg() or imagepng() etc...
(http://us3.php.net/manual/en/function.imagegif.php)
its actually pretty cool. do a little playing around with it.
if you need more help just ask. i would use gd functions personally. it would look the same across different browsers without as much code, and you can easily fill in data to the php picture from a database. you could even produce multiple charts using the same picture file
pghcollectibles
11-06-2008, 08:41 AM
here is the code for a table vertical bar graph:


<html><head>
<style>
.blue {background-color: #0000ff}
.green {background-color: #00ff00}
.red {background-color: #ff0000}
.pink {background-color: #ff00ff}
.yellow {background-color: #ffff00}
</style>
</head><body>
<table cellspacing='5' cellpadding='0' border='0' width='100' height='100'>
<tr>

<td valign='bottom'><table border='0'><tr><td class='blue' height='27' width='10'></td></tr></table></td>
<td valign='bottom'><table border='0'><tr><td class='green' height='83' width='10'></td></tr></table></td>
<td valign='bottom'><table border='0'><tr><td class='red' height='54' width='10'></td></tr></table></td>
<td valign='bottom'><table border='0'><tr><td class='pink' height='73' width='10'></td></tr></table></td>
<td valign='bottom'><table border='0'><tr><td class='yellow' height='44' width='10'></td></tr></table></td>

</tr></table>
</body></html>
pghcollectibles
11-06-2008, 09:10 AM
here is the gd vertical bar graph:

save this code as bargraph.php or whatever you want:


<?php
// create a blank image
$image = imagecreatetruecolor(100, 100);
// fill the background color
$bg = imagecolorallocate($image, 255, 255, 255);
// choose colors
$white = imagecolorallocate($image, 255, 255, 255);
$blue = imagecolorallocate($image, 0, 0, 255);
$green = imagecolorallocate($image, 0, 255, 0);
$red = imagecolorallocate($image, 255, 0, 0);
$pink = imagecolorallocate($image, 255, 0, 255);
$yellow = imagecolorallocate($image, 255, 255, 0);
// draw some lines
imagefilledrectangle($image, 0, 0, 99, 99, $white);
imagefilledrectangle($image, 8, 99, 17, 72, $blue);
imagefilledrectangle($image, 26, 99, 35, 16, $green);
imagefilledrectangle($image, 44, 99, 53, 45, $red);
imagefilledrectangle($image, 62, 99, 71, 26, $pink);
imagefilledrectangle($image, 80, 99, 89, 55, $yellow);
// output the picture
header("Content-type: image/png");
imagepng($image);
imagedestroy($image);
?>
(it is a picture) you would display it by using
<img border='0' src='bargraph.php' />here is an example (http://www.pghcollectibles.com/downloads/phpimage/bargraphs.php) of both. look at the source code for the page.
DataMan
11-06-2008, 11:17 AM
http://www.aditus.nu/jpgraph/

DataMan
pghcollectibles
11-06-2008, 12:58 PM
there you go. looks pretty good too.
pghcollectibles
11-06-2008, 02:41 PM
jpgraph would have to be installed then you would still need to write the code for jpgraph to help execute it. have you used jpgraph dataman?