skip to the main content area of this page
In Appreciation of Open Flash Chart

OFC-2 - Bar Width Control

OFC Logo

This patch implements the capability to adjust the width of the bars for both vertical and horizontal bar charts. By default, 80% (0.8) of the space allocated to a bar is used. This enhancement allows you to change that default to use 100% (1.0) of the space if desired (actually there is no check so you can make each bar 150% (1.5) or more if desired).

Acknowledgement: yeshuawatso started this enhancement in the forum. Thanks!

Patch Information

ID #TBD - Bar Width Control

I will generate a patch after the next release of OFC2.

Download a prebuilt SWF and source code on the Downloads page.

As of 28 January 2009:

Bar Width Control HAS NOT been included in OFC2 Development

Sample Charts

This first chart demonstrates multiple bars each with different width. The purple bar is set to use 90% of its space ("barwidth":0.9) and the yellow bar is set to use 20% of its space ("barwidth":0.2).

Here is a link to view the JSON. Here is a quick look at the JSON:

              "elements":[
                  { "type":      "bar",
                    "alpha":     0.5,
                    "colour":    "#9933CC",
                    "text":      "barwidth = 0.9",
                    "font-size": 10,
                    "barwidth": 0.9,
                    "values" :   [9,6,7,9,5,7,6,9,7]
                  },
                  { "type":      "bar",
                    "alpha":     0.5,
                    "colour":    "#CC9933",
                    "text":      "barwidth = 0.2",
                    "font-size": 10,
                    "barwidth": 0.2,
                    "values" :   [4,9,6,7,9,5,7,6,9]
                  }
              ],

-----

This next chart demonstrates a histogram chart where the bar takes up 100% ("barwidth":1) of its space so that each bar touches the one next to it.

Here is a link to view the JSON. Here is a quick look at the JSON:

              "elements":[
                  { "type": "bar_filled",
                    "alpha": 0.5,
                    "colour": "#9933CC",
                    "outline-colour": "#660099",
                    "text": "barwidth = 1.0",
                    "font-size": 10,
                    "barwidth": 1,
                    "values" : [9,6,7,9,5,7,6,9,7]
                  }
              ],

-----

And just for fun, here is the above chart with the barwidth set to 1.5.

-----