Peity Charts
A "/" delimiter is assumed to mean "three out of five", otherwise all of the values are included in the chart and the total is the sum of all values.
<span class="peity-pie">1/5</span>
<span class="peity-pie">226/360</span>
<span class="peity-pie">0.52,1.041</span>
<span class="peity-pie">1,2,3,2,2</span>
Donut charts are the same as pie charts and take the same options with an added innerRadius option which defaults to half the radius.
<span class="peity-donut">1/5</span>
<span class="peity-donut">226/360</span>
<span
class="peity-donut">0.52,1.041</span>
<span class="peity-donut">1,2,3,2,2</span>
Line charts work on a comma-separated list. Line charts can take as options: delimiter, fill, height, max, min, stroke, strokeWidth and width.
<span class="peity-line">5,3,9,6,5,9,7,3,5,2</span>
<span class="peity-line">5,3,2,-1,-3,-2,2,3,5,2</span>
<span class="peity-line">0,-3,-6,-4,-5,-4,-7,-3,-5,-2</span>
Bar charts work in the same way as line charts and take the following options: delimiter, fill, height, max, min, padding and width.
<span class="peity-bar">5,3,9,6,5,9,7,3,5,2</span>
<span class="peity-bar">5,3,2,-1,-3,-2,2,3,5,2</span>
<span class="peity-bar">0,-3,-6,-4,-5,-4,-7,-3,-5,-2</span>
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.