Center the text in the middle of donut hole pie chart - Javascript Chart.js

Javascript examples for Chart.js:Pie Chart

  1. HOME
  2. Javascript
  3. Chart.js
  4. Pie Chart

Description

Center the text in the middle of donut hole pie chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.js"></script> 
      <script type="text/javascript" src="https://rendro.github.io/easy-pie-chart/javascripts/jquery.easy-pie-chart.js"></script> 
      <link rel="stylesheet" type="text/css" href="https://rendro.github.io/easy-pie-chart/stylesheets/jquery.easy-pie-chart.css"> 
      <script type="text/javascript">
    $(window).load(function(){/*from  w w w. j  a  v  a2  s. c om*/
$(function() {
    $('.chart_1').easyPieChart({
        easing: 'easeOutElastic',
        delay: 3000,
        barColor: '#62ae41',
        scaleColor: false,
        lineWidth: 10,
        trackWidth: 10,
        animate: false,
        lineCap: 'square'
    });
});
    });

      </script> 
   </head> 
   <body> 
      <div class="chart_1" data-percent="90"> 
         <span>6</span> 
      </div>  
   </body>
</html>

Related Tutorials