Template:Bar chart/doc

From Wikipedia, the free encyclopedia
Jump to navigation Jump to search

Lua error in Module:TNT at line 159: Missing JsonConfig extension; Cannot load https://commons.wikimedia.org/wiki/Data:I18n/Uses TemplateStyles.tab.

This template can be used to create a horizontal bar chart, scrolling down a page, in a format which can be parsed by text-based web browsers. The data items can be simple numbers, or the result of calculations based on template parameters.

Each data number (data1=7, data2=23...), in column 1, is scaled to parameter "data_max=" and the bars are sized by width in em units, such as "bar_width=16". By default, the data numbers are shown within each bar, but might display outside a bar when a relatively small number generates a short bar. Each bar can also have a comment, such as "comment7=xx" to show "(xx)" after the number in bar 7.

For a 2-column bar chart, the 2nd column items have prefix "col2_" such as scale maximum, col2_data_max=110, and col2_data3=67 with col2_comment3=zz. See below: "Example with two data columns". Each bar chart can be formatted typically within 1/5 second.

Usage and parameters

[edit source]
The use of text other than numbers and proper punctuation in a data field will result in an Expression error.
{{Bar chart
| title         = <!-- Title bolded above table; defaults to "List of cities by population" in {bar_chart}. -->
| table_width   = <!-- Sets the overall table width in em -->
| bar_width     = <!-- uses 30 by default. Must be an unformatted number -->
| label_type    = <!-- Title for the label column; defaults to "City". -->

| label1        = <!-- Row 1 label -->
| label2        = <!-- Row 2 label -->
...
| label30       = <!-- Row 30 label -->

| data_type     = <!-- Title for column 1 data. In {{Bar chart}}, defaults to "Population". -->
| data_max      = <!-- Upper bound on the values in column 1 data fields (uses data1 if not present) -->
| data1         = <!-- Row 1, Column 1 data -->
| comment1      = <!-- Row 1, Column 1 comment -->
| data2         = <!-- Row 2, Column 1 data -->
| comment2      = <!-- Row 2, Column 1 comment -->
...
| data30        = <!-- Row 30, Column 1 data. {{Bar chart 4x9}} only supports up to data9. -->
| comment30     = <!-- Row 30, Column 1 comment. {{Bar chart 4x9}} only supports up to comment9.  -->

| col2_data_type= <!-- Title for column 2 data -->
| col2_data_max = <!-- Upper bound on the values in column 2 data fields (uses col2_data1 if not present) -->
| col2_data1    = <!-- Row 1, Column 2 data -->
| col2_comment1 = <!-- Row 1, Column 2 comment -->
| col2_data2    = <!-- Row 2, Column 2 data -->
| col2_comment2 = <!-- Row 2, Column 2 comment -->
...
| col2_data30   = <!-- Row 30, Column 2 data. {{Bar chart 4x9}} only supports up to col2_data9.  -->
| col2_comment30= <!-- Row 30, Column 2 comment. {{Bar chart 4x9}} only supports up to col2_comment9.  -->
}}

Alignment

[edit source]

To float the bar chart on the right of the page, use 

| float       = right

To float the bar chart on the left of the page, use 

| float       = left

To float the bar chart to the center of the page, use 

| float       = center

The default is none.

Caption

[edit source]

To add a caption to the bottom of the chart, use 

| caption     =

Empty cells

[edit source]

Use – or — (or a similar dash character) as a placeholder in a cell where there is no data available. Leaving a cell completely blank can sometimes cause columns to be misaligned.

Example

[edit source]
Largest cities of Foo, 2009 Census
City Population
City1
540,921
City2
194,343
City3
190,414
City4
134,669
City5
114,983
{{Bar chart
| title      = Largest cities of Foo, 2009 Census
| bar_width  = 35
| data_max   = 600000
| label_type = City  | data_type = Population
| label1     = City1 | data1     = 540,921
| label2     = City2 | data2     = 194,343
| label3     = City3 | data3     = 190,414
| label4     = City4 | data4     = 134,669
| label5     = City5 | data5     = 114,983
}}

Example with comments

[edit source]
Annual revenue passenger statistics
Year Passengers (% change from prior year)
2003-04
110,649(+17.8%)
2004-05
130,429(+17.9%)
2005-06
138,547(+6.2%)
2006-07
138,844(+0.2%)
2007-08
149,544(+7.7%)
2008-09
148,435(-0.7%)
2009-10
168,147(+13.3%)
{{Bar chart
| title      = Annual [[revenue passenger]] statistics
| label_type = Year
| data_type  = Passengers (% change from prior year)
| data_max   = 170,000
| label3  = 2003-04 | data3  = 110,649 | comment3  = +17.8%
| label4  = 2004-05 | data4  = 130,429 | comment4  = +17.9%
| label5  = 2005-06 | data5  = 138,547 | comment5  =  +6.2%
| label6  = 2006-07 | data6  = 138,844 | comment6  =  +0.2%
| label7  = 2007-08 | data7  = 149,544 | comment7  =  +7.7%
| label8  = 2008-09 | data8  = 148,435 | comment8  =  -0.7%
| label9  = 2009-10 | data9  = 168,147 | comment9  = +13.3%
}}

Example with two data columns

[edit source]
Annual passenger and aircraft statistics
Fiscal year Revenue passengers Aircraft movements
2001-02
20,194
2,281
2002-03
22,057
2,633
2003-04
34,794
2,664
2004-05
49,234
2,754
2005-06
57,732
3,004
2006-07
64,881
2,956
2007-08
63,904
2,912
2008-09
54,718
2,811
2009-10
52,210
2,791
{{Bar chart
| title       = Annual passenger and aircraft statistics
| bar_width   = 20
| label_type  = [[Fiscal year]]
| label1  = 2001-02
| label2  = 2002-03
| label3  = 2003-04
| label4  = 2004-05
| label5  = 2005-06
| label6  = 2006-07
| label7  = 2007-08
| label8  = 2008-09
| label9  = 2009-10
| data_type = Revenue passengers
| data_max  = 66,000
| data1  = 20,194
| data2  = 22,057
| data3  = 34,794
| data4  = 49,234
| data5  = 57,732
| data6  = 64,881
| data7  = 63,904
| data8  = 54,718
| data9  = 52,210
| col2_data_type = Aircraft movements
| col2_data_max  = 3,200
| col2_data1  = 2,281
| col2_data2  = 2,633
| col2_data3  = 2,664
| col2_data4  = 2,754
| col2_data5  = 3,004
| col2_data6  = 2,956
| col2_data7  = 2,912
| col2_data8  = 2,811
| col2_data9  = 2,791
}}

Template data

[edit source]
This is the TemplateData for this template used by TemplateWizard, VisualEditor and other tools. See a monthly parameter usage report for Template:Bar chart in articles based on its TemplateData.

TemplateData for Bar chart


Formatted, commented code (as of 22 Jun 2025)

[edit source]
<includeonly>
  <!-- Outer container for the bar -->
  <div class="bar-chart-bar"
       {{#if: {{{width|}}} |
         style="width: {{{width|40}}}em;"
       }}>
    <!-- Inner div for the visual bar, scaled based on value/max_value -->
    <div class="bar-chart-bar-line"
         style="width: {{#iferror:
           {{#expr: {{{width|40}}} * {{formatnum:{{{1|300000}}}|R}} / {{formatnum:{{{2|600000}}}|R}} round 1}}
           | 0
         }}em;">
    </div>
    <!-- Text label showing the value and optional comment -->
    <span class="bar-chart-bar-numbers"
          {{#if: {{{width|}}} |
            style="width: {{{width}}}em;"
          }}>
      {{nowrap|
        {{formatnum: {{replace|{{{1|300000}}}|,|}}}}
        {{#if: {{{comment|}}} |
          <span class="bar-chart-bar-comment">({{{comment}}})</span>
        }}
      }}
    </span>
  </div>
</includeonly>
<noinclude>
  {{documentation}}
</noinclude>

See also

[edit source]
Retrieved from "http://70.231.62.181/index.php?title=Template:Bar_chart/doc&oldid=16954534"