Dynamic status bar image creation in php

Question

I am new to image creation in php.

If you change the param value, bar progress should also be changed to passed value

How can i implement something like that?

I would be grateful if anyone can shed some light

Thanks for the help inadvance

UPDATE: I figured it out myself, thank you Greg and all for the suggestions ... please test this code

<?php
header("Content-type: image/png");

$p = $_GET['percentage']; //(e.g. 20);
$w = 50;
$h = 100;

$nh = $h - ($h*$p)/100; 

$im = imagecreatetruecolor($w, $h);

$color1 = imagecolorallocate($im, 238,236,224);
$color2 = imagecolorallocate($im, 201,216,209);

//background
imagefilledrectangle($im, 0, 0, $w, $h, $color1);

//front
imagefilledrectangle($im, 0, $nh, $w, $h, $color2);

//output the image
imagepng($im);
imagedestroy($im);

?>

Answer 1

Try its built in GD libraries. http://ca3.php.net/manual/en/ref.image.php

http://ca3.php.net/manual/en/function.imagecreate.php

Answer 2

Alternatively, have you considered using pure CSS? Here is some quick code, I drew up. It could be more clean than this, but you can get the idea:

<?php
$v = (int)$_GET['v'];
$font_size_offset = 9.25; // you'll have to play with this, to get it just right.
                          // alter it based on the size of the font you use for #label.
if($v < 0 || $v > 100) { $v = 0; }
?>

<style type="text/css">
#container {
        height: 400px;
        width: 100px;
        border: 1px solid black;
}

#fill_wrapper {
        width: 100%;
        position: relative;
        top: <?php echo ($v < 10) ? (100 - $font_size_offset - $v) : (100 - $v); ?>%;
}

#label {
        font-size: 32px;
        padding-left: 10px;
        color: black;
}

#fill {
        width: 100%;
        height: <?php echo $v; ?>%;
        background-color: red;
}

</style>

<div id="container">
        <div id="fill_wrapper">
                <?php if($v < 10) { echo '<span id="label">' . $v . '%</span>'; } ?>
                <div id="fill">
                        <?php if($v >= 10) { echo '<span id="label">' . $v . '%</span>'; } ?>
                </div>
        </div>
</div>

Style it how you want it...

Answer 3

Take a look at PHP GD. It gives you image manipulation/creation.

http://php.net/manual/en/book.image.php

Answer 4

Using GD in php you can use the following snippet:

header("Content-type: image/png"); 

<?

$percent = $_GET['percent']; //(e.g. 0.2);
$height = 100;


$im = imagecreatetruecolor(55, $height);
$color1 = imagecolorallocate($im, 55,255,255);

$color2 = imagecolorallocate($im, 102,102,0);


imagefilledrectangle($im, 0, 0, 55, $height * $percent, $color1 );

imagefilledrectangle($im, 0, 5 + $height * $percent, 55, $height, $color2 );

//output the image
imagepng($im);
imagedestroy($im);

?>