Peity

Official Docs

Pie

1/5 226/360 0.52/1.561 1,4 226,134 0.52,1.041 1,2,3,2,2

Donut

1/5 226/360 0.52/1.561 1,4 226,134 0.52,1.041 1,2,3,2,2

Line & Bar

                  5,3,9,6,5,9,7,3,5,2
                  5,3,2,-1,-3,-2,2,3,5,2
                  0,-3,-6,-4,-5,-4,-7,-3,-5,-2
                

5,3,9,6,5,9,7,3,5,2 5,3,2,-1,-3,-2,2,3,5,2 0,-3,-6,-4,-5,-4,-7,-3,-5,-2

Dynamic

5,3,9,6,5,9,7,3,5,2 5,3,2,-1,-3,-2,2,3,5,2 0,-3,-6,-4,-5,-4,-7,-3,-5,-2 4,7,6,5 5,3,9,6,5

Attributes

1/7 2/7 3/7 4/7 5/7 6/7 7/7

Updating

5,3,9,6,5,9,7,3,5,2,5,3,9,6,5,9,7,3,5,2

Options

Reference	Details
`Build Status`	Peity (sounds like deity) is a jQuery plugin that converts an element's content into a mini `<svg>` pie, donut, line or bar chart.
`Basic Usage`	HTML `<span class="pie"n>3/5</span> <span class="donut"n>5,2,3</span> <span class="line"n>3,5,1,6,2</span> <span class="bar"n>2,5,3,6,2,1</span>` JavaScript (jQuery) `$(".pie").peity("pie"); $(".donut").peity("donut"); $(".line").peity("line"); $(".bar").peity("bar");`
`Pie Charts`	Call `peity("pie")` on a jQuery selection. There are two subtly different pie chart semantics, a "/" delimiter is assumed to mean "three out of five" and only the first two values will be drawn, otherwise all of the values are included in the chart and the total is the sum of all values. You can also pass `delimiter`, `fill`, `height`, `radius` and `width` options. Passing a radius will set the correct width and height, the pie will always be a circle that fits the available space.
`Donut Charts`	Donut charts are the same as `pie charts` and take the same options with an added `innerRadius` option which defaults to half the radius.
`Line Charts`	Line charts work on a comma-separated list of digits. Line charts can take the following options: `delimiter`, `fill`, `height`, `max`, `min`, `stroke`, `strokeWidth` and `width`.
`Bar Charts`	Bar charts work in the same way as line charts and take the following options: `delimiter`, `fill`, `height`, `max`, `min`, `padding` and `width`.
`data-* attributes`	Data attributes can be used to pass custom settings per-chart - options explicitly passed to the `peity()` function take precedence over data-* attributes.
`Colours Dynamically`	Pie, donut and bar chart colours can be defined dynamically based on the values of the chart. When passing an array its values are cycled, when passing a function it is called once for each value allowing you to define each bar or segment's colour. The callback is invoked with the value, its index, and the full array of values - the same arguments as the callback for `Array#forEach`.
`Updating Charts`	Charts can be updated by changing the the jQuery selection's text content and calling `change()` on it. The chart will be redrawn with the same options that were originally passed to it.
`Documentations`	Please visit: http://benpickles.github.io/peity/