Along with all the slick widget packages--[BLT], [ClassyTcl],
and so on--which build in canvas-oriented barcharting, there's
a dead-simple but too-little-known [pure-Tcl] technique, the "dilation trick" for
generating barcharts for Web applications.

[[Show picture of example output [http://phaseit.net/demonstration/barchart.cgi].  Show sample code.
Discuss axes and legends.  Explain alternatives for
generation of color image.  Refer to color codes.]]
[[Cross-language comments in
[http://www-106.ibm.com/developerworks/library/l-sc4/].]]



A different way to roughly the same visual content is by way of [JavaScript].
This is interesting simply for its architectural distinctiveness.
[http://developer.netscape.com/docs/technote/javascript/graph/] provides examples.

With more recent graphical browsers, [CSS] provides a couple of
ways to fabricate bars, including this example taken from
Peter van Kamen:
   <div style="background-color:red  ;height:16px;width:100px;"></div>
   <div style="background-color:blue ;height:16px;width: 50px;"></div>
   <div style="background-color:green;height:16px;width: 70px;"></div>
   <br />
   <div style="position:relative;background-color:red;
        width:16px;height:100px;"></div>
   <div style="position:relative;background-color:blue;
        width:16px;height: 50px;top: -50px;left: 20px;"></div>
   <div style="position:relative;background-color:green;
        width:16px;height: 70px;top:-120px;left: 40px;"></div>




"[Web special effects]" has related information.









----
It's easy enough to whip together a simple barchart on a [canvas]
without any extension.  Here's an example:
    pack [canvas .c]
    set y_origin 100
    set x_origin 20
    set heights {11 30 15 16 77 5 14 12 8 33 9}
    foreach height $heights {
        set x_next [expr $x_origin + 5]
        .c create rectangle \
                  $x_origin $y_origin $x_next [expr $y_origin - $height]
        set x_origin $x_next
    }
----
[Category GUI] |