Pie diagram in PHP
PHP is a very powerful web scripting language. We can easily create images on web page using php.
Now the question is there are thousands of image editing software to create marvellous images, why we need php script to draw image for us.
The answer is php is dynamic. Most of the image editing software are designed to create still images. But in some case we need a dynamic image such as in CAPTCHA, or current web statistics, or progress bar and so on.
Suppose we have to draw a pie chart which will get its value changed every minute or manually by operator. So the pie chart will be changed as the values will be changed.
Lets start with
<?php
?>
That is out php script begining. Let our file name is pie.php and it is a target file of another file say bowler.php which provides the updated data every minutes.
Assume that we are building a pie chart for a cricket score board specially for the bowler’s statistics. Let we divide the bowler’s delivery in some categories say good length, short pitched, full toss. So we have to divide the pie chart by three category.
Assume we get the statistics as POST data and receive the data as
$good=(int)$_POST['good'];
$short=(int)$_POST['short'];
$full_toss=(int)$_POST['full'];
Ok I have taken three data. Now I need to make a sum and calculate their percentage angle with respect to 360 degree.
$tot=$good+$short+$full_toss;
$p_good=$good*360/$tot;
$p_short=$short*360/$tot;
$p_full=$full_toss*360/$tot;
Ok I have calculated the percentage angle now I will create the pie diagram. It can be easily done with imagefilledarc() function.
Lets discuss something about imagefilledarc() funciton. The function actually looks like bool imagefilledarc (resource $image,int $center_x,int $center_y,int $width,int $height,int $start_angle, int $end_angle, int $color, int $stylle)
Lets see what the parameter do;
$image= a resource which can be create by imagecreate() funciton;
$center_x= the x coordinate of the center of the arc
$center_y= the y coordinate of the center of the arc
$width= the width of the arc
$height= the height of the arc;
The arc is drown clockwise
$start_angle= the starting angle of the arc in degree;
$end_angle=the ending angle of the arc in degree;
here 0 degree means the position of 3′O clock position;
$color= it is the integer representing color, which can be obtained by using the funciton imagecolorallocate() function.
And finally the $style takes some built in integer such as IMG_ARC_PIE, IMG_ARC_CHORD, IMG_ARC_NOFILL, IMG_ARC_EDGED;
We will use IMG_ARC_PIE to generate pie diagram.
Lets draw
<?php
$temp_image=ImageCreate(400,400);
// now allocating color
$bg=ImageColorAllocate($temp_image,255,255,255);// this will be our background color
$good_color=ImageColorAllocate($temp_image,0,139,139);// dark cyan
$short_color=ImageColorAllocate($temp_image,255,105,180);// hot pink
$full_color=ImageColorAllocate($temp_image,255,69,0);// orange pink
//good length starts from 0 degree;
$start_angle=0;
$end_angle=$p_good;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$good_color,IMG_ARC_PIE);
$start_angle=$end_angle;// the second pie start where the first pie ends
$end_angle=$start_angle+$p_short;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$short_color,IMG_ARC_PIE);
$start_angle=$end_angle;
$end_angle=$start_angle+$p_full;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$full_color,IMG_ARC_PIE);
header (”Content-type: image/jpeg”);
ImageJPEG($temp_image);
ImageDestroy($temp_image);// we have to destroy the image after drawing
// else it will occupy memory in server
?>
We can use a html form to supply data
like the following bowler.php page
bowler.php
—————————————————–
<html>
<body>
<p align=”center”>Enter the data</p>
<table align=”center” width=”500″>
<tbody>
<form name=”form1″ action=”pie.php” method=”post”>
<tr>
<td width=”250″>Good Length bowl</td><td><input type=”text” size=”15″ name=”good”></td>
</tr>
<tr>
<td width=”250″>Short pitched bowl</td><td><input type=”text” size=”15″ name=”short”></td>
</tr>
<tr>
<td width=”250″>Full toss bowl</td><td><input type=”text” size=”15″ name=”full”></td>
</tr>
<tr>
<td width=”250″></td><td><input type=”submit” value=”submit” name=”submit”></td>
</tr>
</form>
</tbody>
</table>
</body>
</html>
—————————————————————————-
And the final code of pie.php will be
pie.php
—————————————————————————–
<?php
$good=(int)$_POST['good'];
$short=(int)$_POST['short'];
$full_toss=(int)$_POST['full'];
$tot=$good+$short+$full_toss;
$p_good=$good*360/$tot;
$p_short=$short*360/$tot;
$p_full=$full_toss*360/$tot;
$temp_image=ImageCreate(400,400);
// now allocating color
$bg=ImageColorAllocate($temp_image,255,255,255);// this will be our background color
$good_color=ImageColorAllocate($temp_image,0,139,139);// dark cyan
$short_color=ImageColorAllocate($temp_image,255,105,180);// hot pink
$full_color=ImageColorAllocate($temp_image,255,69,0);// orange pink
//good length starts from 0 degree;
$start_angle=0;
$end_angle=$p_good;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$good_color,IMG_ARC_PIE);
$start_angle=$end_angle;// the second pie start where the first pie ends
$end_angle=$start_angle+$p_short;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$short_color,IMG_ARC_PIE);
$start_angle=$end_angle;
$end_angle=$start_angle+$p_full;
imagefilledarc($temp_image,200,200,200,200,$start_angle,
$end_angle,$full_color,IMG_ARC_PIE);
header (”Content-type: image/jpeg”);
ImageJPEG($temp_image);
ImageDestroy($temp_image);
?>
————————————————————————————
I will discuss how a captcha generator work in the next PHP post.
Tags:imagecolorallocate, imagecreate, imagefilledarc, PHP
