Extjs chart 总结 reload-chart.js 修改
最近用到 Extjs自带的 reload-chart.js
我将其例子中的代码更改成从后台读取json字符串格式的动态获取数据效果:
界面效果:
?
?
我的js代码如下:
?
?
?
Extjs 自带的 reload-chart.js
?
?
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', xField: 'month', xAxis: new Ext.chart.CategoryAxis({ title: 'Month' }), yAxis: new Ext.chart.NumericAxis({ title: 'Hits' }), extraStyle: { xAxis: { labelRotation: -90 } } } });});?