`
bianyangjie
  • 浏览: 723 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

extjs折线图实现求助

阅读更多
页面代码如下:
<script type="text/javascript">
Ext.onReady(function() {
//创建一个Store
var store = Ext.create('Ext.data.JsonStore', {
    fields : ['date','price1','price2','price3','price4'],
proxy:{
type:'ajax',
url:'chartSearch',
reader:{
type:'json'
}
}
});
//创建图表对象
var monthHistogram = Ext.create('Ext.panel.Panel', {
renderTo : Ext.getBody(),
title : '价格统计图',
border:false,  
tbar : [ '时间',{
xtype:'combo',
format:'Y-M',//显示类型
name:'month',
id:'month',
store:['2013-07','2013-08','2013-09','2013-10','2013-11','2013-12','2014-01'],
emptyText:'2013-12',
editable : false
},'银行类别:', {
xtype : 'combo',
name : 'bankType',
id : 'bankSearch',
store : ['国股','北上南宁','省会城商','全国城商','外资','农商农合','信用社村镇'],
emptyText:'国股',
editable : false
}, '-', {
text : '查询',
handler : function() {
store.load({
params : {
'month':Ext.getCmp('month').getValue(),
'bankType' : Ext.getCmp('bankSearch').getValue()
}
});
}
} ],
items :{
xtype:'chart',
store : store,
axes : [ {//定义坐标轴
title : 'Price', //纵轴标题
type : 'Numeric',
position : 'left',
fields : [ 'price' ],
majorTickSteps:15,
minorTickSteps:1
}, {
title : 'Time',
type : 'Time',
position : 'bottom',
fields : [ 'date' ],
dateFormat : 'd'
} ],
series : [ {
type : 'line',
displayName : '小票买断价',
xField : 'date',
yField : 'price1',
style : {
color : 0xCCFF00
}
}, {
type : 'line',
displayName : '大票买断价',
xField : 'date',
yField : 'price2',
style : {
color : 0xCC0000
}
}, {
type : 'line',
displayName : '当天出款价',
xField : 'date',
yField : 'price3',
style : {
color : 0x0033FF
}
}, {
type : 'line',
displayName : '带票价',
xField : 'date',
yField : 'price4',
style : {
color : 0x66CC00
}
} ]
}
});

store.load({
params : {
'month':'2013-12',
'bankType' : '国股'
}
});
})
</script>

后台取到json数据格式如下:
[{"date":1,"price1":"","price2":6.12,"price3":"","price4":""},{"date":2,"price1":"","price2":6.12,"price3":"","price4":6},
{"date":3,"price1":"","price2":6.08,"price3":"","price4":5.92},
{"date":4,"price1":"","price2":6.08,"price3":"","price4":""},...余下省略]

页面实现效果如图:


求教,我的页面中哪里出现了错误,为什么有数据了,但是折线图还是显示不出来??
  • 大小: 10.4 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics