Create pie chart in Chart.js

var ctx = document.getElementById("pie_chart").getContext('2d');

var myChart = new Chart(ctx, {
   type: 'pie',
   data: {
      labels: ['Point 1', 'Point 2', 'Point 3', 'Point 4'],
      datasets: [{
         labels: "Pie chart",
         data: [20, 50, 40, 30],
         backgroundColor: ["red", "blue", "orange", "green"]
      }]
   }
});

Add below code into your HTML

<canvas id="pie_chart" width="400" height="200"></canvas>

Live Demo

A pie chart can be created with Chart.js by adding Chart.js library on your webpage and creating a new instance of its function Chart(). You will also have to pass the chart type and data required to plot the chart. You can pass multiple objects into datasets array to plot multiple layers of pie chart into one chart.

Was this helpful?