Posts Tagged Prograss Bar

Dynamic progress bar or status bar using GD library

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

Dynamic bars using GD Library in PHP


You can view the working demo here.

You can download the source code here.

PHP Code:-

<?php
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 <img> tag.

<img src=”bar.php?s=0&e=100&c=100&p=1″ />

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.

, ,

No Comments