Javascript examples for Chart.js:Doughnut Chart
Reverse Chart.js Label Order for doughnut chart
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.js"></script> <script type="text/javascript"> window.onload=function(){/* w w w . j av a 2 s . c o m*/ var context = document.getElementById('myChart').getContext('2d'); new Chart(context, { type: 'doughnut', data: { labels: [ 'Blue', 'Red' ], datasets: [ { data: [7, 3], backgroundColor: [ 'rgba(54, 162, 235, 0.7)', 'rgba(208, 54, 100, 0.7)', ], } ] }, options: {rotation: (0.5 * Math.PI)} }); } </script> </head> <body> <canvas id="myChart" width="400" height="400"></canvas> </body> </html>