Pie Chart Javascript Library

The JS Library is now on GitHub! Download it, Fork it, Add some spices to make it more delicious!

I noticed that the Pie Chart Generator is being used a lot, so I decided to improve the way we can create this pie, using the generator you can only create static pies, but what if we need to create a pie based on numbers from a database?

You can now download and use the Javascript library that will create your pie anywhere on your webpage.


Download the Javascript file from Google Code.
Here's the link.


Include the Javascript file into your webpage.

      <script src="CSSpie.js">


Create the pie using the following line of code.

       createPie(name, size, baseColor, numberOfSlices, Percentages, Colors);

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.

    var Pie = createPie(name, size, baseColor, numberOfSlices, Percentages, Colors);

And That's it!




No comments:

Post a Comment