此頁面為 Module:Bar 的說明文件

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