Question

我想在我的一个ExtJS4图表中有很多LineSeries。

我有一个看起来像这样的商店：

Ext.define('DayStatistics', {
    extend:'Ext.data.ArrayStore',
    fields:[ 'date', 'count_impressions', 'count_clicks', 'count_conversions' ]
});

根据我在网格视图中选择的条目数量，我想为每个条目绘制三条线（'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();
    }
}

有了这个，我可以改变网格视图中的哪个条目来图表。但这不是我想要的。我怎样才能展示“多家商店”？

我想到了一个解决方案，我必须尝试：“线性化”商店，做这样的事情{date：'impressions_1'，'impressions_2'，...}。但是，这种解决方案只会将黑客的复杂性从图表转移到商店。

Answer 1

问题的前半部分是有道理的，但本段将其抛弃：

有了这个，我可以改变网格视图中的哪个条目来图表。但这不是我想要的。我怎样才能展示“多家商店”？

我认为你的意思是多个系列。

使用您在问题中包含的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();
}

将多个系列加载到图表中

1 个答案: