Difference between revisions of "PieChart"
From Sega Retro
| Line 1: | Line 1: | ||
| − | <includeonly>{{#vardefine:diameter|{{{diameter|400}}}}}{{#vardefine:totalAngles|0}}{{#vardefine:contents|{{{1|}}}}}<div style="width:{{#var:diameter}}px; height:{{#var:diameter}}px; | + | <includeonly>{{#vardefine:diameter|{{{diameter|400}}}}}{{#vardefine:segmentCount|0}}{{#vardefine:totalAngles|0}}{{#vardefine:contents|{{{1|}}}}}<div style="width:{{#var:diameter}}px; height:{{#var:diameter}}px; |
{{#if:{{{1|}}}| | {{#if:{{{1|}}}| | ||
| Line 17: | Line 17: | ||
{{PieChartSegment | {{PieChartSegment | ||
| angle=10 | | angle=10 | ||
| − | | | + | | caption=aaa |
}} | }} | ||
{{PieChartSegment | {{PieChartSegment | ||
| angle=20 | | angle=20 | ||
| − | | | + | | caption=bbb |
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=30 | ||
| + | | caption=ccc | ||
}} | }} | ||
{{PieChartSegment | {{PieChartSegment | ||
| angle=40 | | angle=40 | ||
| − | | | + | | caption=ddd |
}} | }} | ||
{{PieChartSegment | {{PieChartSegment | ||
| angle=50 | | angle=50 | ||
| − | | colour= | + | | caption=eee |
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=60 | ||
| + | | caption=fff | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=45 | ||
| + | | caption=ggg | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=45 | ||
| + | | caption=hhh | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=10 | ||
| + | | caption=iii | ||
| + | | colour=555555 | ||
}} | }} | ||
}} | }} | ||
| + | |||
{{#var:legend}} | {{#var:legend}} | ||
[[Category:Templates]]</noinclude> | [[Category:Templates]]</noinclude> | ||
Revision as of 05:48, 10 March 2022
I was wondering if you could make a pie chart from CSS alone. Turns out you can.
So let's have a go. Mine will be slightly different because I don't like the idea of using an image. Also it might not work. -Black Squirrel (talk) 10:45, 9 March 2022 (EST)
aaa (2.78%)
bbb (5.56%)
ccc (8.33%)
ddd (11.11%)
eee (13.89%)
fff (16.67%)
ggg (12.5%)
hhh (12.5%)
iii (2.78%)