我想用两个数据集更新图表js中的折线图。我设法以某种方式清空了图表,然后能够填写其中一个数据集。但无法使两个数据集均正常工作。这是代码。
ajaxRequest(
{
url: 'reports/updateChart/?filter=true',
method: 'post',
data: data
}, function (response)
{
/*refresh the tables with the new data sets*/
removeData(myChart);
let label = [1, 234, 234, 234, 234, 234, 234, 34, 234, 23, 23, 41, 3, 2, 4];
let data = [234, 234, 5, 23, 34, 234, 234, 234],[22, 1, 123, 14, 2]
}; addData(myChart, label, data);
});
});
功能:
function removeData(chart) {
chart.data.labels = [];
chart.data.datasets.forEach((dataset) => {
dataset.data = [];
});
chart.update();
}
function addData(chart, label, data) {
$.each(label, function (index, value) {
chart.data.labels.push(value);
});
chart.data.datasets.forEach((dataset) => {
$.each(data, function (index, value) {
dataset.data.push(value);
});
});
chart.update();
}
答案 0 :(得分:2)
我无法找到代码的问题,但是您可以参考以下更新图表的方法,该方法与您尝试过的非常相似,但是可以正常工作。您也可以参考小提琴-> http://jsfiddle.net/cuzx3L7j/4/
希望有帮助!
function clearAndAddNewDataSets() {
myChart.config.data.datasets = [];
myChart.config.data.labels = [];
var labels = ['Label1', 'Label2', 'Label3', 'Label4', 'Label5', 'Label6', 'Label8', 'Label8'];
var data = [
[234, 234, 5, 23, 34, 234, 234, 234],
[22, 1, 123, 14, 2]
]
var colors = ['Red', 'Green'];
myChart.config.data.labels = labels;
for (i = 0; i < data.length; i++) {
var dataSet = {
label: 'testLabel' + i,
data: data[i],
backgroundColor: colors[i]
}
myChart.config.data.datasets.push(dataSet);
}
myChart.update();
}