. function generateProgressBar() { $n = $_GET['n']; if ($n < 0) { $n = 0; } else if ($n > 100) { $n = 100; } $img = imagecreate(100, 10); $done = imagecolorallocate($img, 0, 200, 0); $left = imagecolorallocate($img, 240, 0, 0); imagefilledrectangle($img, 0, 0, $n, 10, $done); imagefilledrectangle($img, $n, 0, 100, 10, $left); header("Content-type: image/png"); imagepng($img); imagecolordeallocate($img, $done); imagecolordeallocate($img, $left); imagedestroy($img); } if (isset($_GET['n'])) { generateProgressBar(); } else { $url = "http://" . $_SERVER["SERVER_NAME"] . $_SERVER["REQUEST_URI"]; ?>

I have just created this tiny project. I will add more options to it and write more information about it soon when I get time. For the time being, here are simple tips on how to use it.

I created this to display progress bar against the tasks I am tracking in a Confluence based internal wiki. I wanted an URL that I can use as a configurable progress bar image. The URL of this project page is the solution I came up with.

The URL of this page be used just like any image if you use it with a query parameter 'n'. On, using this parameter, you get an image instead of this page.

For example, check this: ?n=60.

So, in web pages, it can be easily used with the img tag. For example, to display a progress of 20%, you would simply include this.

<img src="?n=20" alt="Progress" title="Progress">

The result would be: Progress