Chart.JS无法读取Undefined的属性'_meta'

时间:2017-08-03 02:32:20

标签: javascript php jquery chart.js2 chart.js

我正在尝试构建基本条形图,但我在标题中收到错误。我已经使用alert()来验证我想要使用保持数据填充图表的数组,但是仍然没有使用语法正确捕获。有人可以检查并让我知道我需要做些什么才能使图表生成出来吗?

    var ctx = document.getElementById('cvtree').getContext('2d');
var chart = new Chart(ctx, {
    type: 'bar',
    data: { 
        labels: yoylabels,
        datasets: [{
                label: 'Pay By Person',
                backgroundColor: 'rgba(0, 129, 214, 0.8)',
                data: numericdollarvals
            }]
    },
    options: {
        },
        legend: {
            display: false,
            position: 'top',
        },
        scales: {
            yAxes: [{
                    ticks: {
                        beginAtZero: true,
                        callback: function (value, index, values) {
                            if (parseInt(value) >= 1000) {
                                return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                            } else {
                                return '$' + value;
                            }
                        }
                    }
                }]
        }
});

1 个答案:

答案 0 :(得分:1)

在设置所有选项之前,您意外关闭了options属性。

这是正确的语法:

var ctx = document.getElementById('cvtree').getContext('2d');
var chart = new Chart(ctx, {
   type: 'bar',
   data: {
      labels: yoylabels,
      datasets: [{
         label: 'Pay By Person',
         backgroundColor: 'rgba(0, 129, 214, 0.8)',
         data: numericdollarvals
      }]
   },
   options: {
      legend: {
         display: false,
         position: 'top',
      },
      scales: {
         yAxes: [{
            ticks: {
               beginAtZero: true,
               callback: function(value, index, values) {
                  if (parseInt(value) >= 1000) {
                     return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                  } else {
                     return '$' + value;
                  }
               }
            }
         }]
      }
   }
});