一个简单的extjs chart练习

本文介绍了一个使用ExtJS实现图表展示的实际案例。该案例通过Struts后台获取JSON数据,并利用ExtJS的ColumnChart组件进行图表绘制。重点在于配置JsonStore的autoLoad属性为true以自动加载数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

做了一个简单的extjs chart练习,数据是从struts后台得到的,一点注意的就是jsonstore的autoLoad属性要设置成true

ChartPanel = Ext.extend(Ext.Panel,{
mydocumentChart:null,
constructor:function() {
this.mydocumentChart = new DocumentChart();
ChartPanel.superclass.constructor.call(this,{
width:600,
height:300,
frame:true,
layout:"fit",
renderTo:"chartPanel",
items:[this.mydocumentChart]
});
}
});
/*****************************************************************************************/
DocumentChart = Ext.extend(Ext.chart.ColumnChart,{
myChartStore:null,
constructor:function() {
this.myChartStore = new ChartStore();
DocumentChart.superclass.constructor.call(this,{
store:this.myChartStore,
url:"ext/resources/charts.swf",
xField:"department",
yField:"documentNumber"
});
}
});
/*****************************************************************************************/
ChartStore = Ext.extend(Ext.data.JsonStore,{
constructor:function() {
ChartStore.superclass.constructor.call(this,{
autoLoad:true,
url:"http://139.28.96.10:8080/premanagement3/secure/chart",
root:"documentCounts",
fields:["department","documentNumber"]
});
}
});
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值