Sjabloon:Percentagebalk
Dit sjabloon geeft een visuele weergave van een hoeveelheid als deel van een andere hoeveelheid.
Gebruik
{{Percentagebalk | aantal | totaal | kleur | opties... }}
Voorbeelden
Code | Resultaat |
---|---|
{{Percentagebalk|50}}
|
<div style="background-color: #ccc; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|50|100|red|background-color=#DDD|border=none}}
|
50 / 100 <div style="background-color: red; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|50|100|#99F|width=85%}}
|
50 / 100 <div style="background-color: #99F; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|50|100|rgb(255,255,16)}}
|
50 / 100 <div style="background-color: rgb(255,255,16); width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|40|100|#F00|per=1}}
|
40 / 100(Fout in uitdrukking: operand voor / ontbreekt.%) <div style="background-color: #F00; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|90|100|#F0F0F0|per=1|background-color=#F00}}
|
90 / 100(Fout in uitdrukking: operand voor / ontbreekt.%) <div style="background-color: #F0F0F0; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|90|100|#F0C|ref=ref-voorbeeld}}
|
90 / 100[1] <div style="background-color: #F0C; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> |
{{Percentagebalk|15|26|#82ba59|noot=2021}}
|
15 / 26 <div style="background-color: #82ba59; width: Fout in uitdrukking: operand voor / ontbreekt.%; height: 100%;"> (2021)
|
- ↑ ref-voorbeeld
Parameters
<templatedata> { "description": "Dit sjabloon geeft een visuele weergave van een hoeveelheid als deel van een andere hoeveelheid.", "params": { "1": { "description": "Aantal eenheden.", "type": "number", "required": true, "label": "Aantal" }, "2": { "description": "Aantal mogelijke eenheden.", "type": "number", "default": "100", "label": "Totaal" }, "3": { "description": "Kleur van de balk.", "type": "line", "default": "#ccc", "label": "Kleur", "example": "red, #00FF00, rgb(0,0,255)" }, "width": { "description": "Totale breedte van de balk.", "example": "100%, 10em, 150px", "type": "line", "default": "100px" }, "per": { "label": "Met percentage", "description": "Of ook het percentage moet worden getoond.", "type": "boolean" }, "ref": { "label": "Referentie", "description": "Voeg een referentie toe bij de aantallen.", "type": "content" }, "border-color": { "aliases": [ "border" ], "description": "Kleur van de rand.", "type": "line", "default": "#aaa", "example": "red, #00FF00, rgb(0,0,255), none" }, "background-color": { "description": "Kleur van de rest van de balk.", "type": "line", "example": "red, #00FF00, rgb(0,0,255)" }, "noot": { "label": "Noot", "description": "Voeg een korte noot toe.", "type": "content" } }, "paramOrder": [ "1", "2", "3", "background-color", "border-color", "width", "per", "ref", "noot" ] } </templatedata>