如何在高图表中添加动态序列

Question

我正在使用高图表在我的应用程序中构建一个图表，我的数据来自数据库。我的系列名称是"年"，可以是 1 或更多，并且基于"年"有相应的数据。 所以我所做的是将所有系列和数据分配给带有 for 循环的字符串变量。 在系列部分中，我将这个字符串变量作为 [系列数据]。但它不起作用。 如果我将字符串变量中的相同值作为静态值分配给数组，则工作正常。请引导我犯错的地方。以下是我的JavaScript函数。

function ShowChartCntRecvdMonth(cntrecvdyears) {
$.getJSON("/Navigation/CntRecvdMonthChart", { Years: cntrecvdyears }, function (data) {
var year = [];
var Qty = [];
var seriesdata = '[';
var seriesdata1 = [{ name: '2019', data: [3883, 3961, 3893, 3780, 4021, 3765, 3560, 4099, 3310, 3403, 3628, 3137,] }, { name: '2020', data: [3489, 3883, 3403, 3331, 2605, 949,] }];
for (var i = 0; i < data.length; i++) {
if (year.includes(data[i].CntRecvdMonthYear)) {
}
else {
year.push(data[i].CntRecvdMonthYear);
}
Qty.push(data[i].CntRecvdMonthQty);
}
for (var j = 0; j < year.length; j++) {
//seriesdata.push('{name: ' + year[j]);
seriesdata += "{name: '" + year[j] + "',data:[";
for (var k = 0; k < data.length; k++) {
if (year[j].includes(data[k].CntRecvdMonthYear)) {
//seriesdata.push(data[k].CntRecvdMonthQty);
seriesdata += data[k].CntRecvdMonthQty + ",";
if (k == data.length - 1) {
seriesdata += ']';
}
}
else {
if (k == data.length - 1) {
seriesdata += ']';
}
}
}
if (j == year.length - 1) {
seriesdata += '}';
}
else {
seriesdata += '},';
}
}
seriesdata += ']';
Highcharts.chart('cntreceivedmonth', {
chart: {
type: 'area'
},
title: {
text: 'Containers Received Chart By Year / Month'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
tickmarkPlacement: 'on',
title: {
enabled: false
}
},
yAxis: {
title: {
text: 'Qty'
},
labels: {
formatter: function () {
return this.value;
}
}
},
tooltip: {
split: true
},
plotOptions: {
area: {
stacking: 'normal',
lineColor: '#666666',
lineWidth: 1,
marker: {
lineWidth: 1,
lineColor: '#666666'
}
}
},
series: [seriesdata], 
//Here if i am giving seriesdata1, works perfectly but when i  am giving [seriesdata] then it does //not work
credits: {
enabled: false
},
});
});
}

Answer 1

Highcharts 中系列所需的格式是一个对象数组，同时，您似乎创建了一个很长的字符串。

有一个文档可以帮助您理解它：

API：https://www.highcharts.com/docs/chart-concepts/series

以及显示输出应如何显示的 API 链接：

API：https://api.highcharts.com/highcharts/series.line.data