图表js饼图:chart.js中的错误?

图表js饼图:chart.js中的错误?

问题描述:

我想用chart.js测试饼图。我得到'无法读取chart.js文件中'长度'和'初始化'的属性。我尝试了所有的选择,无法找到问题所在。图表js饼图:chart.js中的错误?

代码的jsfiddle

https://jsfiddle.net/n8ox2fqb/1/

enter image description here

pieChart.js文件下面的代码。

var pieData = [ 
    { 
     value: '25', 
     label: 'Java', 
     color: '#811BD6' 
    }, 
    { 
     value: '10', 
     label: 'Scala', 
     color: '#9CBABA' 
    }, 
    { 
     value: '30', 
     label: 'PHP', 
     color: '#D18177' 
    }, 
    { 
     value : '35', 
     label: 'HTML', 
     color: '#6AE128' 
    } 
] 



var pieOptions = {}; 

$(document).ready(function() { 

    var ctxt = document.getElementById('myChart'); 
    var myPieChart = new Chart(ctxt,{ 
     type: 'pie', 
     data: pieData, 
     options: pieOptions 
    }); 

}); 

HTML代码

<html lang="en"> 
    <head> 
     <script src="src/jquery.min.js"></script> 
     <script src="src/Chart.js"></script> 
    </head> 
      <Title> 
       Test Pie Chart 
      </Title> 
    <body> 
     <div> 
      <div> 
       <canvas id="myChart" width="400" height="400"></canvas> 
      </div> 
     </div> 
     <script src="pieChart.js"></script> 
    </body> 
</html> 
+3

小提琴缺少一些引用 – Ju66ernaut

+0

喜欢什么信息,指导我请。 – SKay

+1

未添加jquery和chart.js。但是我认为你需要使用chart.js的画布的2D上下文。 – Ju66ernaut

把我的头我会说有给我一个明显的问题的顶部,这是行

var ctxt = document.getElementById('myChart'); 

你想

var ctxt = document.getElementById('myChart').getContext('2d'); 

您可能还在喂食图表d ata格式错误。图表配置对象中的'data'属性有一个名为'datasets'的属性,它是一个对象数组。 Check out their docs here

+0

我也试过了! – SKay