Circle

Overview

This example will display a plain circle 360 degree.

sample screenshot

This example requires mandatory resources :

And also but optional :

The progress meter wait 200ms (line 14) between each step of 10% (line 15).

There are 10 pictures segments built (line 33) and re-used (lines 27-30). Width and Height are equivalent to diagonal size:

<?php
/**
* Draw a plain Circle progress meter.
*
* @version $Id: circle.php,v 1.4 2006/05/24 08:47:45 farell Exp $
* @author Laurent Laville <pear@laurent-laville.org>
* @package HTML_Progress2
* @subpackage Examples
* @access public
*/
require_once 'HTML/Progress2.php';
$pb = new HTML_Progress2();
$pb->setAnimSpeed(200);
$pb->setIncrement(10);
$pb->setOrientation(HTML_PROGRESS2_CIRCLE);
$pb->setCellAttributes('width=50 height=50 spacing=0 background-color=#EEEEEE');
$pb->setLabelAttributes('pct1', 'top=20');
$fileMask = 'c%s.png';
$cacheDir = 'cache/';
if (!is_dir($cacheDir)) {
die("Directory <b>$cacheDir</b> does not exists");
}
if (file_exists($cacheDir . 'c0.png')) {
// uses cached pictures rather than create it again
foreach (range(0,10) as $index) {
$file = sprintf($cacheDir . $fileMask, $index);
$pb->setCellAttributes(array('background-image' => $file), $index);
}
} else {
// creates circle segments pictures only once
$pb->drawCircleSegments($cacheDir, $fileMask);
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3c.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Circle Progress2 example</title>
<style type="text/css">
<!--
<?php echo $pb->getStyle(); ?>
body {
background-color: #EEEEEE;
}
-->
</style>
<?php echo $pb->getScript(false); ?>
</head>
<body>
<?php
$pb->display();
$pb->run();
?>
</body>
</html>