Template:Bar box/doc

{{Bar box}}, {{bar percent}}, {{bar pixel}} and {{bar stacked}} are a family of templates for construction of horizontal bar charts.

Usage

{{Bar box
|width   =  width of the graph         (optional)
|barwidth=  width of the bararea       (optional, defaults to 100px)
|float   =  (left|right|none)          (optional, defaults to none)
|title   =  title of the chart         (optional)
|titlebar=  title bar colour           (optional, defaults to none)
|left1   =  first left column header   (optional)
|left2   =  second left column header  (optional)
|right1  =  first right column header  (optional)
|right2  =  second right column header (optional)
|bars    =  chart contents             (see below)
|caption =  caption under the chart    (optional)
}}

Chart contents

Bar box can contain any number of bars. There are three types of bars:

• Percentage bar:

{{bar percent|row label|colour|value (width in percents)|optional value label}}

If value label is not provided, it is constructed from the percentage and "%".

• Pixel bar:

{{bar pixel|row label|colour|value (width in pixels)|value suffix|optional value label}}

If value label is provided, value suffix is ignored. Otherwise, the value label is constructed from the value and the value suffix. This is used as shorthand. Both following examples give identical results:

{{bar pixel|foo|red|12||12,345}}
{{bar pixel|foo|red|12|,345}}

• Stacked bars:

{{bar stacked|1st left label|1st right label|color 1|width 1 (in pixels)|...|color 5|width 5 (in pixels)|note1=2nd left label|note2=2nd right label|collapsed=(yes|y|1)|id=collapsible id}}

All parameters are optional, but, if 'id' is not supplied, 'collapsed' has no effect. You should use a custom toggle as the default toggle will distort the chart (see the last example).

Examples

{{Bar box
|float=right
|caption=distribution of stuff
|width=200px
|bars=
{{bar percent|foo|red|30}}
{{bar percent|bar|green|40}}
{{bar percent|baz|blue|20}}
{{bar percent|bla|orange|8}}
{{bar percent|bla|teal|2|1/50}}
}}

foo			30%
bar			40%
baz			20%
bla			8%
bla			1/50
distribution of stuff

{{Bar box
|title=Quantity of stuff
|titlebar=#DDD
|left1=kinds of stuff
|right2=pcs.
|width=400px
|bars=
{{bar pixel|Foobar|red|33|,213}}
{{bar pixel|Barfoo|green|123|,123}}
{{bar pixel|Bazbar|blue|210|,121}}
{{bar pixel|Barfoobaz|orange|13||12,854}}
|caption=Some stuff displayed by quantity.
}}

Quantity of stuff kinds of stuff pcs. Foobar   33,213 Barfoo   123,123 Bazbar   210,121 Barfoobaz   12,854 Some stuff displayed by quantity.

{{Bar box
|float=right
|title=Election results
|titlebar=#AAF
|left1=party
|left2=year
|right1=votes
|right2=change
|width=300px
|bars=
{{bar percent 2|Left|1898|silver|33|1902|red|42|+9%}}
{{bar percent 2|Right|1898|silver|40|1902|black|35|-5%}}
{{bar percent 2|Middle|1898|silver|17|1902|blue|10|-7%}}
{{bar percent 2|Other|1898|silver|10|1902|gray|13|+3%}}
|caption=1902 and 1898 election results in Freedonia compared.
}}

Election results
party	year		votes	change
Left	1898		33%	+9%
	1902		42%
Right	1898		40%	-5%
	1902		35%
Middle	1898		17%	-7%
	1902		10%
Other	1898		10%	+3%
	1902		13%
1902 and 1898 election results in Freedonia compared.

{{Bar box
|width=250px
|title=
<div class="mw-customtoggle-a mw-customtoggle-b">Toggle first 2</div>
<div class="mw-customtoggle-b mw-customtoggle-c">Toggle last 2</div>
|bars=
{{bar stacked|January|(---)|red|3|blue|22|id=a}}
{{bar stacked|February|+60%|red|8|blue|26|green|6|collapsed=yes|id=b}}
{{bar stacked|March|+25%|red|11|blue|18|green|8|orange|11|magenta|20|note1=foo|note2=+11%|id=c}}
}}

Toggle first 2 Toggle last 2 January ​ ​ (---) February ​ ​ ​ +60% March foo ​ ​ ​ ​ ​ +25% +11%

Tracking category

• Category:Pages using bar box without float left or float right (18)

See also

• {{Vertical bar chart}}
• {{Bar chart}}
• {{Data bars}}
• WP:Graphs