2 bianyangjie bianyangjie 于 2013.12.05 10:00 提问

extjs如何把折线图chart放入到panel中进行显示
Ext.onReady(function() { //创建每月贴现价格统计图 //通过JSON从数据库中获取数据 var chartStore = Ext.create('Ext.data.JsonStore', { fields : [ 'date', 'price1', 'price2', 'price3', 'price4' ], proxy : { type : 'ajax', url : 'chartSearch', reader : { type : 'json' } } }); //四条按交易类别区分的统计线 var monthPriceChart=Ext.create('Ext.chart.Chart', { id:'monthPriceChartid', animate: true, /* renderTo:'LineChart', */ width: 500, height: 300, store : chartStore, axes : [ {//定义坐标轴 title : 'Price', //纵轴标题 type : 'Numeric', position : 'left', fields : [ 'price1','price2','price3','price4'], grid:true, minimum:0 }, { title : 'Day', type : 'Category', position : 'bottom', fields : [ 'date' ] } ], series : [ { type : 'line', highlight:{ size:7, radius:7 }, displayName : '小票买断价', xField : 'date', yField : 'price1', markerConfig:{ type:'cross', size:4, radius:4, 'stroke-width':0 }, style : { color : 0xCCFF00 } }, { type : 'line', highlight:{ size:7, radius:7 }, displayName : '大票买断价', xField : 'date', yField : 'price2', markerConfig:{ type:'circle', size:4, radius:4, 'stroke-width':0 }, style : { color : 0xCC0000 } }, { type : 'line', highlight:{ size:7, radius:7 }, displayName : '当天出款价', xField : 'date', yField : 'price3', markerConfig:{ type:'cross', size:4, radius:4, 'stroke-width':0 }, style : { color : 0x0033FF } }, { type : 'line', highlight:{ size:7, radius:7 }, displayName : '带票价', xField : 'date', yField : 'price4', markerConfig:{ type:'circle', size:4, radius:4, 'stroke-width':0 }, style : { color : 0x66CC00 } } ] }); //创建一个panel var chartPanel = Ext.create('Ext.panel.Panel', { id:'chartPanel', renderTo : Ext.getBody(), title : '价格统计图', layout:'border', border : false, autoScroll:true, 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() { chartStore.load({ params : { 'month' : Ext.getCmp('month').getValue(), 'bankType' : Ext.getCmp('bankSearch') .getValue() } }); } } ] }); chartStore.load({ params : { 'month' : '2013-12', 'bankType' : '国股' } }); })

以上是我的页面代码,如何使得折线图chart能够放入到panel中进行显示,我用的是extjs4-2-1版本,求详细解答,谢谢

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!