模組:Bar/doc

Module:Bar可以為棒形圖產生有色的棒形，應用於較頂層的模板中。

用法

數據系

在調用該模塊時，須提供一系列數值。

系列由多組 == 組成，每組有2﹣3個參數：數值、顏色以及可選填的提示資訊。

例如：

{{#invoke:bar|format|4,green,完成|2,gray,進行中|4,#FCC,未完成}}

總數

可以指定棒形中有多少個數值。如果指定的數量比實際提供的數量多，模塊就會在末端加入相應的空白。例如：

{{#invoke:bar|format|7,green,完成|total=10}}
{{pb}}
{{#invoke:bar|format|4,green,完成|total=10}}
{{pb}}
{{#invoke:bar|format|2,green,完成|total=10}}

寬度

默認寬度設為100%，但可換做任何CSS寬度值。例如：

{{#invoke:bar|format|7,green,完成|width=5em}}
{{pb}}
{{#invoke:bar|format|7,green,完成|width=15em}}

CSS

可用CSS改變棒形外觀。例如：

{{#invoke:bar|format|7,green,完成|total=10|width=30em|barCSS=border:1px solid #CCC}}

例子

完成度

{| role="presentation"
|{{#invoke:bar|format|7,green,完成|total=10|width=30em|barCSS=border:1px solid #CCC;}}
|{{#expr:7 / 10 * 100}}%
|}

70%

層疊棒形圖

{| class="wikitable"
|+ 支出與收入
|-
| 2011年
| {{#invoke:bar|format|100,red,支出|50,green,收入|total=170|width=30em}}
|-
| 2012年
| {{#invoke:bar|format|75,red,支出|90,green,收入|total=170|width=30em}}
|}

支出與收入

2011年
2012年

分組棒形圖

{| class="wikitable"
|+ 支出與收入
|-
| 2011
| {{#invoke:bar|format|150,green,收入|total=160|width=15em}}
{{#invoke:bar|format|100,red,支出|total=160|width=15em}}
|-
| 2012
| {{#invoke:bar|format|160,green,收入|total=160|width=15em}}
{{#invoke:bar|format|75,red,支出|total=160|width=15em}}
|}

支出與收入

2011
2012