EXT4.×曲线图的问题
ms262963081
2011-12-01
http://www.iteye.com/problems/76063
]项目中EXT升到4.0.2a后,生成曲线图时,页面卡死,看电脑进程里内存跑的很高,感觉是数据量太大生成那些图形时卡掉的。 在IE9下,虽然慢但是能生成出来,IE8下就卡死了,并且浏览器提示几次如果继续可能会发生错误。 看到官网说4.1的性能提升很大,更换后确实感觉快了一些,但还是IE9下没事,IE8卡死。 一共有9条曲线,每条曲线由200个点连出来,测试IE8下最多4条,再多就卡死。 能否在加载时,默认只生成显示4条,剩下的不生成,然后点击图例的时候再生成别的曲线。找了好久没找到这个怎么控制,求解 或者各位还有什么别的办法能解决,帮助下,小弟新手,感谢 感谢。[/size] 附上代码,见笑。 var win = Ext.create('Ext.panel.Panel', { width: 985, height: 700, hidden: false, maximizable: true, title: '曲线图', renderTo: 'Line', layout: 'fit', items: { xtype: 'chart', style: 'background:#fff', animate: true, store: VMASChartStore, shadow: true, theme: 'Category1', legend: { position: 'bottom' }, axes: [{ type: 'Numeric', minimum: 0, position: 'left', fields: ['HC', 'CO', 'CO<sub>2</sub>', 'NO', 'O<sub>2</sub>', 'Power', 'Force', 'Velocity' ], minorTickSteps: 1, grid: { odd: { opacity: 1, fill: '#ddd', stroke: '#bbb', 'stroke-width': 0.5 } } }, { type: 'Numeric', position: 'bottom', fields: ['TimeNumber'], title: '时间' }], series: [{ type: 'line', title: 'HC(单位:1.0ppm)', highlight: { size: 7, radius: 7 }, fill :false, axis: 'left', xField: 'TimeNumber', yField: 'HC', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的HC为:' + storeItem.get('HC')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: 'CO(单位:50.0%)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'CO', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的CO为:' + storeItem.get('CO')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: '功率(单位:1kW)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'Power', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的功率为:' + storeItem.get('Power')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: 'CO2(单位:5.0%)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'CO<sub>2</sub>', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的CO<sub>2</sub>为:' + storeItem.get('CO<sub>2</sub>')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: 'NO(单位:50.0ppm)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'NO', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的NO为:' + storeItem.get('NO')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: 'O2(单位:30.0%)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'O<sub>2</sub>', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的O<sub>2</sub>为:' + storeItem.get('O<sub>2</sub>')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', title: '力(单位:50N)', highlight: { size: 7, radius: 7 }, axis: 'left', xField: 'TimeNumber', yField: 'Force', tips: { trackMouse: true, width: 150, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的力为:' + storeItem.get('Force')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }, { type: 'line', highlight: { size: 7, radius: 7 }, title: '车速(单位:1.0km/h)', axis: 'left', smooth: true, xField: 'TimeNumber', yField: 'Velocity', tips: { trackMouse: true, width: 180, height: 25, renderer: function (storeItem, item) { this.setTitle('第' + storeItem.get('TimeNumber') + '秒的车速为:' + storeItem.get('Velocity')); } }, markerConfig: { type: 'circle', size: 3, radius: 3, 'stroke-width': 0 } }] } |
|
ms262963081
2011-12-01
|
|
ms262963081
2011-12-02
|