用ExtJS生成报表的时候,如果y轴的值太小的话就看不到数据了,就会造成一种假象,给人一种错觉就是出错了,只看到x轴,看不到y轴和报表里面的内容,其实报表已经生成了,只是看不到而已,所以需要修改y轴的最小值和最大值。
function generateData() {
var data = [];
for (var i = 0; i < 12; ++i) {
data.push([Date.monthNames[i],
(Math.floor(Math.random() * 11) + 1) * 100]);
}
return data;
}
Ext.onReady(function() {
var store = new Ext.data.ArrayStore({
fields : ['month', 'hits'],
data : generateData()
});
new Ext.Panel({
width : 700,
height : 400,
renderTo : document.body,
title : 'Column Chart with Reload - Hits per Month',
tbar : [{
text : 'Load new data set',
handler : function() {
store.loadData(generateData());
}
}],
items : {
xtype : 'columnchart',
store : store,
yField : 'hits',
url : '../../resources/charts.swf',
xField : 'month',
xAxis : new Ext.chart.CategoryAxis({
title : 'Month'
}),
yAxis : new Ext.chart.NumericAxis({
title : 'Hits',
minimum : 1,
maximum : 1500
}),
extraStyle : {
xAxis : {
labelRotation : -90
}
}
}
});
});
其中红色字体部分用于控制Y轴的最小值和最大值。