Pie Charts

Pie Charts

Graph Code
1/5 <span data-plugin="peity-pie" data-colors="#62a3ff,#ebeff2" data-width="30" data-height="30">1/5</span>
226/360 <span data-plugin="peity-pie" data-colors="#2bbbad,#ebeff2" data-width="30" data-height="30">226/360</span>
0.52/1.561 <span data-plugin="peity-pie" data-colors="#33b5e5,#ebeff2" data-width="30" data-height="30">0.52/1.561</span>
1,4 <span data-plugin="peity-pie" data-colors="#ff8800,#ebeff2" data-width="30" data-height="30">1,4</span>
226,134 <span data-plugin="peity-pie" data-colors="#ef4554,#ebeff2" data-width="30" data-height="30">226,134</span>
0.52,1.041 <span data-plugin="peity-pie" data-colors="#4c5667,#ebeff2" data-width="30" data-height="30">0.52,1.041</span>

Donut Charts

Graph Code
1/5 <span data-plugin="peity-donut" data-colors="#7266ba,#ebeff2" data-width="30" data-height="30">1/5</span>
226/360 <span data-plugin="peity-donut" data-colors="#fb6d9d,#ebeff2" data-width="30" data-height="30">226/360</span>
0.52/1.561 <span data-plugin="peity-donut" data-colors="#4285f4,#ebeff2" data-width="30" data-height="30">0.52/1.561</span>
1,4 <span data-plugin="peity-donut" data-colors="#2bbbad,#ebeff2" data-width="30" data-height="30">1/4</span>
226,134 <span data-plugin="peity-donut" data-colors="#33b5e5,#ebeff2" data-width="30" data-height="30">226,134</span>
1,2,3,2,2 <span data-plugin="peity-donut" data-colors="#ff8800,#ebeff2" data-width="30" data-height="30">1,2,3,2,2</span>

Line and Bars Charts

Graph Code
5,3,9,6,5,9,7,3,5,2,5,3,9,6,5,9,7,3,5,2 <span class="updating-chart">5,3,9,6,5,9,7,3,5,2</span>
5,3,9,6,5,9,7,3,5,2 <span data-plugin="peity-line" data-fill="#ef4554" data-stroke="#ef4554" data-width="100" data-height="40">5,3,9,6,5,9,7,3,5,2</span>
5,3,2,-1,-3,-2,2,3,5,2 <span data-plugin="peity-line" data-fill="#4c5667" data-stroke="#4c5667" data-width="100" data-height="100">5,3,2,-1,-3,-2,2,3,5,2</span>
0,-3,-6,-4,-5,-4,-7,-3,-5,-2 <span data-plugin="peity-line" data-fill="#7266ba" data-stroke="#7266ba" data-width="100" data-height="100">0,-3,-6,-4,-5,-4,-7,-3,-5,-2</span>
5,3,9,6,5,9,7,3,5,2 <span data-plugin="peity-bar" data-colors="#fb6d9d,#ebeff2" data-width="100" data-height="30">5,3,9,6,5,9,7,3,5,2</span>
5,3,2,-1,-3,-2,2,3,5,2 <span data-plugin="peity-bar" data-colors="#62a3ff,#ebeff2" data-width="100" data-height="30">5,3,2,-1,-3,-2,2,3,5,2</span>

Data-attributes charts

Graph Code
6/7 <span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#4c5667", "#ebeff2"], "innerRadius": 24, "radius": 30 }'">6/7</span>
4/7 <span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#5fbeaa", "#ebeff2"], "innerRadius": 18, "radius": 28 }'">4/7</span>
5/7 <span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#5d9cec", "#ebeff2"], "innerRadius": 20, "radius": 24 }'">5/7</span>
6/7 <span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#fb6d9d", "#ebeff2"], "innerRadius": 18, "radius": 20 }'">6/7</span>
5/7 <span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#7266ba", "#ebeff2"], "innerRadius": 18, "radius": 20 }'">5/7</span>