Revision [10607]

This is an old revision of BarGraph made by DennyShimkoski on 2005-08-11 02:15:39.

 

A Simple HTML-Based Bar Graph


This has only been tested on Win 2000 using IE 6 and Firefox 1.0.2.

The Code

Save it as actions/bargraph.php

<?php

/* Copyright (C) 2005  Denny Shimkoski

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details. */


if (!class_exists('bar_graph'))
{
    class bar_graph
    {
        var $title;
        var $width;
        var $class;
        var $values = array();
        function bar_graph($title = '', $width = 250, $class = 'bar_graph')
        {
            $this->title = $title;
            $this->width = $width;
            $this->class = $class;
        }
        function add($label, $n, $color = '')
        {
            $this->values[] = array('label' => $label, 'n' => $n, 'color' => $color);
        }
        function show($show_percentage = false)
        {
            if (sizeof($this->values) > 0)
            {
                $max = 0;
                echo '<table class="' . $this->class . '" cellpadding="6" cellspacing="0" border="0">';
                if (!empty($this->title)) echo "\n<tr><th class=\"title\" colspan=\"2\">$this->title</th></tr>";
                foreach ($this->values as $value) $max = $value['n'] > $max ? $value['n'] : $max;
                foreach ($this->values as $value)
                {
                    $normal = $value['n'] / $max;
                    $percent = ceil($normal * 100);
                    if ($percent > 15)
                    {
                        $div_close = ($show_percentage) ? "$percent%</div>" : $value['n'] . '</div>';
                    }
                    else
                    {
                        $div_close = ($show_percentage) ? "</div>&nbsp;$percent%" : '</div>&nbsp;' . $value['n'];
                    }
                    $width =  ceil($normal * $this->width);
                    $color = !(empty($value['color'])) ? "background-color:{$value['color']}" : '';
                    echo "\n<tr><th>{$value['label']}</th><td class=\"n\"><div style=\"width:{$width}px;$color\">&nbsp; $div_close</td></tr>";
                }
                echo "\n</table>";
            }
        }
    }
}

if (isset($vars['title']) && isset($vars['data']))
{
    $graph = new bar_graph($vars['title']);
    $data = split(';', $vars['data']);
    foreach ($data as $row)
    {
        $row = split(':', $row);
        $color = isset($row[2]) ? $row[2] : '';
        $graph->add($row[0], $row[1], $color);
    }
    $show_percentage = isset($vars['percents']);
    $graph->show($show_percentage);
}

?>


The CSS


.bar_graph {background-color: #eef; border: 1px solid darkblue; font-size: .9em}
.bar_graph th.title {color:#007; background-color: #dde; border-style: solid; border-width: 1px; border-color: #fff #aae #aae #fff}
.bar_graph th, .bar_graph td {font-family: verdana, sans-serif; text-align:left;}
.bar_graph td.n {font-size:10px;}
.bar_graph td.n div {float:left; text-align:right; color:#333; background-color: #669; border-style: solid; border-width: 1px; border-color: #fff #003 #003 #fff; padding-right: 5px;}


The Examples


{{bargraph title="Some Variables" data="Variable 1:100:#aaf;Variable 2:16:#eee;Variable 3:146:#cfc"}}

{{bargraph title="Some Variables" data="Variable 1:100:#aaf;Variable 2:18:#eee;Variable 3:146:#cfc" percents="true"}}


The Screenshot


Screenshot of the BarGraph action's output

Authors


DennyShimkoski


CategoryUserContributions
There are 8 comments on this page. [Show comments]
Valid XHTML :: Valid CSS: :: Powered by WikkaWiki