我正在创建一个包含来自不同 JSON 文件的数据的折线图,下面的代码正在工作,但我想知道如何将这些来自不同 API 的 JSON 数据分组到一个中,每个循环以缩短代码。
//consider the vol1- vol10 looks like var vol1 = ['1123', '1234','5436'];
//because i have other method the convert it to an arrray
//Xvol1 is just something like Xvol1=["Jan","Feb","Mar"]
$('#trendChart').highcharts({
chart: {
type: 'spline'
},
title: {
text: false
},
xAxis: {
categories : Xvol1
},
yAxis: {
title: {
text: 'Volume',
},
min: 0
},
plotOptions: {
spline: {
marker: {
enabled: true
}
}
},
series: [{
name: $(".profileName0").html(),
data: vol1
},
{
name: $(".profileName1").html(),
data: vol2
},
{
name: $(".profileName3").html(),
data: vol3
},
{
name: $(".profileName2").html(),
data: vol4
},
{
name: $(".profileName4").html(),
data: vol5
},
{
name: $(".profileName5").html(),
data: vol6
},
{
name: $(".profileName6").html(),
data: vol7
},
{
name: $(".profileName7").html(),
data: vol8
},
{
name: $(".profileName8").html(),
data: vol9
},
{
name: $(".profileName9").html(),
data: vol10
},
]
});
更新 1:我已经尝试过,但它似乎不起作用。
var series = [];
for(i = 0; i < 10; i++){
series.push({name: $('.profileName'+i+'"').html(),, data: vol[i]});
}
$('#trendChart').highcharts({
chart: {
type: 'spline'
},
title: {
text: false
},
xAxis: {
categories : Xvol1
},
yAxis: {
title: {
text: 'Volume',
},
min: 0
},
plotOptions: {
spline: {
marker: {
enabled: true
}
}
},
series: [series]
});
});
通过 for 循环成功生成数据后,我现在正在为如何更新数据而苦恼,我尝试使用 setData()
更新它,但似乎它需要如此调整才能工作。
var seriesData = [vol1, vol2, vol3, vol4, vol5, vol6 , vol7, vol8, vol9, vol10]; // add all the vols. I have used 2 for example
var series = [];
for(i = 0; i < 5; i++){
series.push({name: names[i], data: seriesData[i]});
}
var trendChart12w = $('#trendChart').highcharts();
trendChart12w.series[0].setData(series);
溶液:
var dataCounting = $(".DataCount").last().html();
var seriesData = [vol1, vol2, vol3, vol4, vol5, vol6 , vol7, vol8, vol9, vol10]; // add all the vols. I have used 2 for example
var trendChart1y = $('#trendChart').highcharts();
trendChart1y.xAxis[0].setCategories(Xvol1);
for(i = 0; i < dataCounting; i++){
trendChart1y.series[i].setData(seriesData[i]);
}
你可以像var names = [all the names]
这样的名称数组和数据数组,比如var seriesData = [vol1, vol2...]
然后做
var series = [];
for(i = 0; i < names.length; i++){
series.push({name: names[i], data: seriesData[i]});
}
然后将其设置为您的图表系列。
更新在图表之外执行此操作。
var seriesData = [vol1, vol2]; // add all the vols. I have used 2 for example
var names = [$(".profileName0").html(), $(".profileName1").html()] // add all names
var series = [];
for(i = 0; i < names.length; i++){
series.push({name: names[i], data: seriesData[i]});
}
然后在你的图表中,你设置系列的地方,只需做 series: series