Chart JS (1)


Chart JS

官網:http://www.chartjs.org/
中文:http://www.bootcss.com/p/chart.js/docs/

1.到官網下載chart.js,並載入
<script type="text/javascript" src="js/chart.js"></script>

2.HTML
<div style="width:500px;">
 <canvas id="sample"></canvas>
</div>

3.Javascript
var s_item = ['一月','二月','三月','四月','五月'];
var s_data = [50,20,30,40,35];

var ctx = document.getElementById("sample");
var myChart = new Chart(ctx, {
 type: 'bar',
 data: {
  labels: s_item,
  datasets: [{
     label: '測試',
     data: s_data
  }]
   }
});

就會有柱狀圖出現:

參考文章: