Peity Charts


Peity (sounds like deity) is a jQuery plugin that converts an element's content into a <svg> mini pie donut line or bar chart and is compatible with any browser that supports <svg>: Chrome, Firefox, IE9+, Opera, Safari.

How to Setup

HTML Structure

Donut Chart

<span class="donut" data-peity='{ "fill": [" #00acf0", "#22af47"]}'>3/5</span>

Pie Chart

<span class="pie">0.52,1.041</span>

Line Chart

<span class="line">0,-3,-6,-4,-5,-4,-7,-3,-5,-2</span>

Bar Chart

<span class="bar">5,3,9,6,5,9,7,3,5,2</span>



<!-- Peity JavaScript -->
<script src="vendors/peity/jquery.peity.min.js"></script>
<script src="dist/js/peity-data.js"></script>

Initialize Peity Chart JS

Donut Chart


Pie Charts


Line Chart


Bar Charts