Wiki
Download the Javascript file from Google Code or GitHub.
Here's the links. css-pie.googlecode.com/files/CSSpie.js github.com/AliBassam/css-pie
Include the Javascript file into your webpage.
<head>
<script src="CSSpie.js">
</script>
</head>
Create the pie using the following line of code.
<script> createPie(name, size, baseColor, numberOfSlices, Percentages, Colors); </script>
name: This is the name that distinguishes each pie, the name will actually be the ID of the created pie.
size: This is the size of the pie in pixels.
baseColor: This is the background color of the pie, you can use HEX or RGB or color names.
numberOfSlices: This is the number of slices that you want in this pie.
Percentages: This is an array of percentages, the number of elements must be the same as the number of slices.
Colors: This is an array of colors.
Now we must place the pie, the createPie function returns an HTML Div Element, so we just need to assign it to a variable, then append it to another element.
<script> var Pie = createPie(name, size, baseColor, numberOfSlices, Percentages, Colors); document.getElementById("MyDiv").appendChild(Pie); </script>
And That's it!
Examples:
createPie("workers","200px","white",5,[10,45,22,11,12],["#FF00FF","#336699","#66CC00","#CC6633","#FFFF99"]);
createPie("students","300px","white",3,[55,12,33],["#CCFFFF","#CCFF66","#003333"]);
