次のコードを使用して、AJAX 呼び出しを介してチャートを更新しようとしています
$j(document).ready(function () {
$j("#filter").click(function () {
BuildReport();
});
$j("#container").highcharts({
chart: {
type: 'column',
marginRight: 130,
marginBottom: 100
},
title: {
text: 'SEs open by Group',
x: -20 //center
},
yAxis: {
title: {
text: ''
},
min: 0,
allowDecimals: false
},
xAxis: {},
tooltip: {
formatter: function () {
return '<b>' + this.x + '</b><br/>' +
this.series.name + ': ' + this.y + '<br/>' +
'Total: ' + this.point.stackTotal;
}
},
plotOptions: {
column: {
stacking: 'normal',
cursor: 'pointer',
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -10,
y: 100,
borderWidth: 0
},
series: {}
});
BuildReport();
});
function SetChartSeries(series) {
debugger;
chart = $j("#container").highcharts();
chart.xAxis[0].setCategories(getReportCategories(series));
chart.series = $j.map(series, function (item) {
return {
name: item.Name,
color: item.Colour,
data: $j.map(item.Items, function (list) {
return {
name: list.Category,
y: list.Value,
id: list.ID
};
})
};
});
}
function getReportCategories(data) {
var catArray = [];
$j.each(data, function (index, value) {
$j.each(value.Items, function (index, value) {
if ($j.inArray(value.Category, catArray)) {
catArray.push(value.Category);
}
});
});
return catArray;
}
function BuildReport() {
$j.ajax({
url: "ChartDataHandler.ashx",
dataType: "json",
cache: false,
success: function (data) {
SetChartSeries(data.Series);
}
});
}
ページが読み込まれるか、フィルター ボタンがクリックされると、BuildReport はハンドラーを呼び出し、シリーズ データを SetChartSeries に渡します。ここから、グラフのプロパティが設定されていることがわかりますが、グラフは描画されません。私は明らかに間違ったことをしていますか?