Dynamic progress bar or status bar using GD library

admin — Sat, 14 Mar 2009 13:38:00 +0000

Sometime you need to show dynamic progress bars or status bars to users. You can create them using GD Library. I am showing here how you can create such kind of bars.

Dynamic bars using GD Library in PHP

You can view the working demo here.

You can download the source code here.

PHP Code:-


header(”Content-type: image/jpeg”);$current = isset($_GET['c']) ? $_GET['c'] : 50;
$start = isset($_GET['s']) ? $_GET['s'] : 0;
$end = isset($_GET['e']) ? $_GET['e'] : 100;
$p = isset($_GET['p']) ? $_GET['p'] : 0;
 
$pos = floor(2 * $current/($end - $start) * 100);
 
$im = imagecreate(200, 16); // width , height px
$white = imagecolorallocate($im, 255, 255, 255);
$black = imagecolorallocate($im, 0, 0, 0);
$green = imagecolorallocate($im, 0, 204, 51);
 
imagesetthickness($im, 2);
 
imagerectangle($im, 0, 0, 200, 15, $white);
imagefilledrectangle($im, 0, 0, $pos, 16, $green);
 
if ($p) {
	$text = ($pos / 2) . ‘%’;
	$font = ‘arial.ttf’;
	$black = imagecolorallocate($im, 0, 0, 0);
	imagettftext($im, 8, 0, 95, 12, $black, $font, $text);
}
 
imagejpeg($im);
imagedestroy($im);
?>

How to use it:-

Save the above PHP code in bar.php file and use this file in the src attribute of tag.

Here we are passing four different parameters to this file.

‘s’ for starting value (Default is ’0′).

‘e’ for end value (Default is ’100′).

‘c’ for starting value (Default is ’50′).

‘p’ for percentage flag (Default is ’0′). If you want to show percentage on your bar then pass ‘p’ = 1.

You can view the working demo here.

You can download the source code here.

A K Chauhan's Blog » Prograss Bar

Dynamic progress bar or status bar using GD library