私はハイチャートを使用しており、配列をループしてさまざまなシリーズを表示する必要があるため、ここに表示されているように表示されます: http://jsfiddle.net/afnguyen/RUZb2/
コードは次のとおりです。
$(function () {
$('#container').highcharts({
title: {
text: 'Retaielr Clicks',
x: -20 //center
},
subtitle: {
text: 'Date',
x: -20
},
xAxis: {
categories: [32,33,24]
},
yAxis: {
title: {
text: 'Clicks'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '°C'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: [{
name: 'Tesco',
data: [43, 27, 47]
}, {
name: 'Asda',
data: [48, 30, 45]
}, {
name: 'Boots',
data: [62, 43, 59]
}, {
name: 'Superdrug',
data: [63, 49, 64]
}, {
name: 'Ocado',
data: [43, 34, 48]
}, {
name: 'Waitrose',
data: [39, 24, 47]
}]
});
});
データは 3 つの配列から取得されます。
weekNoArray[32,32,32,32,32,32,33,33,33,33,33,33,34,34,34,34,34,34] //this is used in the xAxis categories
retailerNameArray[Tesco,Asda,Boots,Superdrug,Ocado,Waitrose,Tesco,Asda,Boots,Superdrug,Ocado,Waitrose,Tesco,Asda,Boots,Superdrug,Ocado,Waitrose] //this needs to be each series name (but only one of each)
clicksArray[43,48,62,63,43,39,27,30,43,49,34,24,47,45,59,64,48,47] //i need to loop through each of these putting them in the data
誰でもこれを行うための最良の方法で助けることができますか?
だから、私が苦労しているのは、シリーズをループする方法です。つまり、次の方法は機能しません。
for (var i = 0; i < data.length; i++)
{
var leadrow = data[i];
series: [{
name: retailerNameArray[i],
data: clicksArray[i]
}]
}
編集
以下は私が使用している実際のコードです
$.ajax({
type: "POST",
url: theUrl,
data: { 'manufacturer': manufacturer, 'country': country, 'category': category, 'startDate': startDate, 'endDate': endDate, 'chartType': chartType },
dataType: "json",
success: function (data) {
var retailerNameArray = [];
var clicksArray = [];
var weekNoArray = [];
var rowTotalArray = [];
var weekArray = [];
var columnTotalArray = [];
var cumTotalArray = [];
var weekCounterArray = [];
var overallClickCountArray = [];
var resellerShareArray = [];
var retailerCount = 0;
for (var i = 0; i < data.length; i++) {
var cumLeadrow = data[i];
//Only display on graph if not 0
if (cumLeadrow.RetailerClickCount > 0) {
// assign to array
retailerCount = cumLeadrow.RetailerCount;
var clicks = cumLeadrow.RetailerClickCount;
clicksArray.push(clicks);
var weekNum = cumLeadrow.WeekNo;
weekNoArray.push(weekNum);
var rowTotal = cumLeadrow.RowTotal;
rowTotalArray.push(rowTotal);
var date = cumLeadrow.WeeklyDate;
weekArray.push(date);
var columnTotal = cumLeadrow.ColumnTotal;
var retailer = cumLeadrow.RetailerDescription;
retailerNameArray.push(retailer);
var resellerShare = cumLeadrow.ResellerShare;
if (i < retailerCount) {
columnTotalArray.push(columnTotal);
resellerShareArray.push(resellerShare);
}
var cumTotal = cumLeadrow.CummulativeTotal;
cumTotalArray.push(cumTotal);
var weekCounter = cumLeadrow.WeeklyCounter;
weekCounterArray.push(weekCounter);
var overallClickCount = cumLeadrow.OverallClickCount;
overallClickCountArray.push(overallClickCount);
}
}
alert(clicksArray);
alert(weekNoArray);
alert(retailerNameArray);
var lowerChart = chartType.toLowerCase();
// Create the chart
$('#chartContainer').highcharts({
chart: {
type: lowerChart
},
title: {
text: manufacturer + ' Cumulative Leads in ' + country + "/" + category + '<br/> from ' + startDate + ' to ' + endDate
},
xAxis: {
categories: weekNoArray,
labels: {
rotation: -45,
align: 'right',
style: {
fontSize: '13px',
fontFamily: 'Verdana, sans-serif'
}
}
},
yAxis: {
min: 0,
title: {
text: 'Retailer Clicks'
},
stackLabels: {
enabled: false,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
},
legend: {
align: 'right',
x: -50,
verticalAlign: 'top',
y: 0,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
credits: {
enabled: false
},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>';
}
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
}
},
series: [{
name: retailerNameArray,
data: clicksArray
}]
});
配列には、上で詳しく説明した値があります。しかし、現在、それらは1つのシリーズのフィドラーの例であり、その下のコードは私が望む結果であるため、配列をループしてシリーズを追加する必要がありますが、これを行う方法がわかりません-それが理にかなっていることを願っています
どうもありがとう