Difference between revisions of "PieChart"
From Sega Retro
| Line 1: | Line 1: | ||
| − | <includeonly>{{#vardefine:diameter|{{{diameter|400}}}}}<div style="width:{{#var:diameter}}px; height:{{#var:diameter}}px; | + | <includeonly>{{#vardefine:diameter|{{{diameter|400}}}}}{{#vardefine:totalAngles|0}}{{#vardefine:contents|{{{1|}}}}}<div style="width:{{#var:diameter}}px; height:{{#var:diameter}}px; |
{{#if:{{{1|}}}| | {{#if:{{{1|}}}| | ||
background: conic-gradient( | background: conic-gradient( | ||
| − | {{{1 | + | {{#sub:{{#var:contents}}|0|-1}} |
); | ); | ||
}} | }} | ||
| Line 14: | Line 14: | ||
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. -[[User:Black Squirrel|Black Squirrel]] ([[User talk:Black Squirrel|talk]]) 10:45, 9 March 2022 (EST) | 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. -[[User:Black Squirrel|Black Squirrel]] ([[User talk:Black Squirrel|talk]]) 10:45, 9 March 2022 (EST) | ||
| − | {{PieChart}} | + | {{PieChart| |
| − | + | {{PieChartSegment | |
| + | | angle=10 | ||
| + | | colour=0000FF | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=20 | ||
| + | | colour=FF00FF | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=40 | ||
| + | | colour=FFFFFF | ||
| + | }} | ||
| + | {{PieChartSegment | ||
| + | | angle=50 | ||
| + | | colour=FF0000 | ||
| + | }} | ||
| + | }} | ||
[[Category:Templates]]</noinclude> | [[Category:Templates]]</noinclude> | ||
Revision as of 04:34, 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)