<div id="container">
<h2>Pie Charts</h2>
<span class="pie1">1/5</span>
<span class="pie2">226/360</span>
<span class="pie3">0.52/1.561</span>
</div>
#container {
  text-align: center;
  width: 100%;
  height: 100%;
}
$("span.pie1").peity("pie", {radius: 32, width: 64});
$("span.pie2").peity("pie", {radius: 24, fill: ["#ff00ff", "#ffccff"]});
$("span.pie3").peity("pie");
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://code.jquery.com/jquery-2.2.4.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/peity/3.2.0/jquery.peity.min.js