Bru*_*tos 5 javascript extjs extjs4 extjs-mvc
我想在我的一个ExtJS4图表中有很多LineSeries.
我有一个看起来像这样的商店:
Ext.define('DayStatistics', {
extend:'Ext.data.ArrayStore',
fields:[ 'date', 'count_impressions', 'count_clicks', 'count_conversions' ]
});
Run Code Online (Sandbox Code Playgroud)
根据我在网格视图中选择的条目数量,我想为每个条目绘制三条线('count_impressions','count_clicks','count_conversions'),这意味着网格视图中的每个条目都会有一对商店里的条目.
目前,我有以下函数,每个selectionchange都调用它:
loadChart: function (Model, records) {
var removeChart = function (chart) {
var series = chart.series.items, surface = chart.surface,
length = series.length, len = surface.groups.keys.length,
array = [];
for (var i = 0; i < length; i++)
array = Ext.Array.merge(array, series[i].group.keys);
chart.series.clear();
for (var j = 0; j < array.length; j++)
surface.items.getByKey(array[j]).destroy();
for (var t = 0; t < len; t++)
surface.groups.items[t].destroy();
};
var chart = Ext.getCmp('advertiserstatisticlist.advertiserChart');
removeChart(chart);
for (var record in records) {
chart.series.add({
type:'line',
xField:'date',
yField:'count_impressions'
});
chart.store.loadData(records[record].data.days, true);
chart.refresh();
}
}
Run Code Online (Sandbox Code Playgroud)
有了它,我可以更改网格视图中的哪个条目进行图表.但这不是我想要的.我怎样才能展示"多家商店"?
我想到了一个解决方案,我必须尝试:通过做这样的事情来"线性化"商店{date:'impressions_1','impressions_2',...}.但是,这种解决方案只会将黑客的复杂性从图表转移到商店.
问题的前半部分是有道理的,但这一段却让人不解:
这样我就可以将网格视图中的哪个条目更改为图形。但这不是我想要的。如何显示“多个商店”?
我假设你的意思是多个系列。
selectionchange使用您在问题中包含的处理程序来做到这一点应该非常简单:
loadChart: function (selModel, records) {
var chart = Ext.getCmp('advertiserstatisticlist.advertiserChart');
chart.series.clear();
for (var record in records) {
chart.series.add({
type:'line',
xField:'date',
yField: record.get(/*[whatever you named the "series name" field in the grid store]*/)
});
}
chart.redraw();
}
Run Code Online (Sandbox Code Playgroud)