Extjs 图表控件,可修改X轴与Y轴坐标
this.xAxisName = '区县名称';
this.yAxisName = '站点个数';
this.store = new Ext.data.ArrayStore({ fields: ['month', 'hits'] }),
this.analysisPanel = new Ext.chart.ColumnChart({
store: this.store,
yField: 'hits',
title: '站点统计',
url: '/JS/Ext3.2.0/resources/charts.swf',
xField: 'month',
xAxis: new Ext.chart.CategoryAxis({
title: this.xAxisName
}),
yAxis: new Ext.chart.NumericAxis({
title: this.yAxisName
}),
extraStyle: {
xAxis: {labelRotation: -90 }
}
});
// 重新设定统计窗体的提交后的更新状态
this.formPanel.form.submit({
success: function(form, action) {
this.parent.analysisPanel.setXAxis(new Ext.chart.CategoryAxis({
// 读取服务器端的x轴名称
title: action.result.xAxisName
}));
this.parent.analysisPanel.setYAxis(new Ext.chart.NumericAxis({
title: action.result.yAxisName
}));
this.parent.store.loadData(generateData(action.result.records));
this.parent.analysisPanel.refresh();
this.parent.analysisWinForm.hide();
},
scope: this,
failure: function(form, action) {
Ext.MessageBox.alert('提示', action.result.msg);
this.parent.analysisWinForm.hide();
}
});
// 将服务器端返回的数据放到store里面,可以弄一个Json store 来搞...
function generateData(records) {
var data=[];
for (var i = 0; i < records.length; i++) {
data.push([records[i].Name, records[i].Value]);
}
return data;
}