使用chart.js将数据添加到折线图

我想在图表中添加一个新数据，但是当调用我的“添加”function时，浏览器会抛出一个错误，上面写着“Uncaught TypeError：undefined is not function”。

似乎图表对象无法识别“AddData”函数，但我不知道如何解决它。 在文档中出现此function它对我不起作用。

.addData（valuesArray，label）在Chart实例上调用addData（valuesArray，label），为每个数据集传递一个值数组，以及这些点的标签。

小提琴样本http://jsfiddle.net/rferreiraperez/pevy7vsz/5/

var myLineChart = new Chart(ctx).Line(data); $("#add").on( "click", function() { var month = $("#month").val(); var point = $("#point").val(); var points = new Array(); points.push(point); console.log("adding..."); console.log("month:" + month); console.log("point:" + point); myLineChart.addData(points, month); }); 

非常感谢。

Answer 1

我测试过了！ 并且发现您使用的Chart.js的版本是0.2.0 ，但它没有Chart.js方法。

你应该使用最新版本，然后再试一次，它应该工作！

http://www.chartjs.org/assets/Chart.min.js

Answer 2

这就是我为折线图做的。

  var label_X = [0]; var data_Y = [0]; var line_chart; var data = { labels: label_X, datasets: [{ label: '# of Generations', data: data_Y, backgroundColor: [ 'rgba(243, 187, 69, 0.7)', 'rgba(54, 162, 235, 0.2)', 'rgba(255, 206, 86, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(153, 102, 255, 0.2)', 'rgba(255, 159, 64, 0.2)' ], borderColor: [ 'rgba(255,99,132,1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)' ], borderWidth: 1 }] }; var options = { scales: { yAxes: [{ ticks: { beginAtZero: true, } }] } }; var ctx = $("#line-chart").get(0); line_chart = new Chart(ctx, { type: 'line', data: data, options: options }); 

这是所有初始化然后您需要进行ajax调用

  $.get("someurl", { dataType: 'json' }).done(function (response) { data_Y.push((response.Y_value)); label_X.push(response.X_labels); line_chart.update(); });