Computer >> Máy Tính >  >> Lập trình >> Javascript

JavaScript Chart.js

Chart.js là một thư viện JavaScript mã nguồn mở. Sử dụng Chart.js, thêm các biểu đồ động, tương tác trên trang web của bạn.

Sau đây là mã cho thư viện Chart.js trong JavaScript -

Ví dụ

<!DOCTYPE html>
<html>
<head>
<script
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
</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: 'HouseHold income',
               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>

Đầu ra

JavaScript Chart.js