測試筆記 Chart.js Pie Chat

Chart.js Pie Chat Simple Sample

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<div style="width: 400px; height: 400px">
  <canvas id="canvasPie"></canvas>
</div>

JavaScript

//資料標題
            var labels= ['高興'];

            var ctx = document.getElementById('canvasPie').getContext('2d');
            var pieChart = new Chart(ctx, {
              type: 'pie',
              data : {
                labels:labels,
                
                   
                    backgroundColor: 
                    //資料顏色
                                "#00A1FF",
                               
                    
                }],
              }
            });
            pieChart.data.datasets[0].data=[70,30];

           
         /*   function changeData()
            {
                //隨機資料
                var randomNum=Math.floor(Math.random() *100) + 1;
                //將隨機資料載入至圖表中
                pieChart.data.datasets[0].data=[randomNum,100-randomNum];
                //更新
                pieChart.update();
            }

            setInterval(changeData,2000);*/