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

时间:2016-07-29 14:49:29

标签: javascript jquery charts

我正在尝试使用chart.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>

1 个答案:

答案 0 :(得分:1)

在我的脑海中,我会说有一个明显的问题,那就是行

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

你想要

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

您也可能以错误的格式提供图表数据。图表配置对象中的“data”属性具有一个名为“datasets”的属性,该属性是一个对象数组。 Check out their docs here