Peity
Pie Charts
Graph | Code |
---|---|
1/5 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">1/5</span>
|
226/360 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">226/360</span>
|
0.52/1.561 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">0.52/1.561</span>
|
1,4 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">1,4</span>
|
226,134 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">226,134</span>
|
0.52,1.041 |
<span data-plugin="peity-pie" data-colors="#675aa9,#ecf2f5" data-width="30" data-height="30">0.52,1.041</span>
|
Donut Charts
Graph | Code |
---|---|
1/5 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" data-width="30" data-height="30">1/5</span>
|
226/360 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" data-width="30" data-height="30">226/360</span>
|
0.52/1.561 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" data-width="30" data-height="30">0.52/1.561</span>
|
1,4 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" data-width="30" data-height="30">1/4</span>
|
226,134 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" data-width="30" data-height="30">226,134</span>
|
1,2,3,2,2 |
<span data-plugin="peity-donut" data-colors="#348cd4,#ecf2f5" 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="#f06292" data-stroke="#f7531f" 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="#f06292" data-stroke="#f7531f" 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="#f06292" data-stroke="#f7531f" 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="#f06292,#ecf2f5" 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="#f06292,#ecf2f5" 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": ["#348cd4", "#ecf2f5"], "innerRadius": 24, "radius": 30 }'">6/7</span>
|
4/7 |
<span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#675aa9", "#ecf2f5"], "innerRadius": 18, "radius": 28 }'">4/7</span>
|
5/7 |
<span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#f06292", "#ecf2f5"], "innerRadius": 20, "radius": 24 }'">5/7</span>
|
6/7 |
<span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#78c350", "#ecf2f5"], "innerRadius": 18, "radius": 20 }'">6/7</span>
|
5/7 |
<span data-plugin="peity-donut-alt" data-peity='{ "fill": ["#45bbe0", "#ecf2f5"], "innerRadius": 18, "radius": 20 }'">5/7</span>
|