Add text to chart.js data - Javascript Chart.js

Javascript examples for Chart.js:Chart Data

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

Description

Add text to chart.js data

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script> 
      <script type="text/javascript" src=" https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.bundle.js"></script> 
      <script type="text/javascript">
    window.onload=function(){/*from   w  ww.j  av  a  2 s  .  co m*/
var c = document.getElementById("chart");
var data = {
      labels: [],
    datasets: [{
       data: [],
      backgroundColor: [],
      hoverBackgroundColor: []
    }]
};
var options = {
      cutoutPercentage: 0,
    rotation: -0.5 * Math.PI,
    circumference: 2 * Math.PI
};
var opt = {
  type: "pie",
  data: data,
  options: options
};
var chart = new Chart(c,opt);
chart.config.data.labels.push("A label");
chart.config.data.labels.push("A label2");
chart.config.data.datasets[0].data.push(10);
chart.config.data.datasets[0].data.push(20);
chart.update();
    }

      </script> 
   </head> 
   <body> 
      <canvas id="chart" width="400px" height="400px"></canvas>  
   </body>
</html>

Related Tutorials