Chart.js là thư viện JavaScript mã nguồn mở. Sử dụng Chart.js, bạn có thể thêm các biểu đồ đồ họa động, tương tác vào trang web.
Dưới đây là mã cho thư viện Chart.js trong JavaScript:
Ví dụ
<!DOCTYPE html> <html> <head> <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script> </head> <body> <canvas id="myChart" width="500" height="300"></canvas> <script type="text/javascript"> var ctx = document.getElementById("myChart"); var myChart = new Chart(ctx, { type: 'bar', data: { labels: ["2005", "2007" , "2009" , "2012", "2014"], datasets: [ { label: 'Thu nhập hộ gia đình', data: [5000,8000,10000,1200,15000], backgroundColor :['rgba(255, 129, 102, 1)', 'rgba(234, 162, 235, 1)', 'rgba(255, 206, 36, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', ] } ], }, options: { scales: { yAxes: [{ ticks: { beginAtZero:true } }] } } }); </script> </body> </html>
Kết quả
