Question

我有一个如下商店

Ext.define('Result', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'state', type: 'string', mapping:0 },
        { name: 'product', type: 'string', mapping:1 },
        { name: 'quantity', type: 'int', mapping:2 }
        { name: 'price', type: 'int', mapping:3 }
    ]
});
var store = Ext.create('Ext.data.ArrayStore', {
    model: 'Result',
    groupField: 'state',
    data: [
        ['MO','Product 1',50,40],
        ['MO','Product 2',75,50],
        ['MO','Product 3',25,60],
        ['MO','Product 4',125,70],
        ['CA','Product 1',50,50],
        ['CA','Product 2',100,40],
        ['WY','Product 1',250,40],
        ['WY','Product 2',25,50],
        ['WY','Product 3',125,86],
        ['WY','Product 4',175,83]
    ]
});

我想计算每个州群的数量和价格的平均值，并将其显示在网格中。我在sencha文档中看到，有一个函数，如average（http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.data.Store-method-average）我可以像

那样实施它

store.avarage('quantity', true);

但它只给出了一个字段的平均值。

如何和我根据组计算多个字段的平均值并将其显示在网格中。

Answer 1

以下是解决数据问题的一种方法 - 我已经为每条记录添加了平均数量和价格字段。我将把它留给您作为练习，以便如何在您的示例中正确更新上述数据的字段设置：

data: (function() {
    var data = [
        ['MO','Product 1',50,40],
        ['MO','Product 2',75,50],
        ['MO','Product 3',25,60],
        ['MO','Product 4',125,70],
        ['CA','Product 1',50,50],
        ['CA','Product 2',100,40],
        ['WY','Product 1',250,40],
        ['WY','Product 2',25,50],
        ['WY','Product 3',125,86],
        ['WY','Product 4',175,83]
    ];

    var qtyByState = {};
    var priceByState = {};
    var record;
    var state;

    for (var i=0, n=data.length; i<n; i++) {
        record = data[i];
        state = record[0];

        if (!qtyByState[state]) {
            qtyByState[state] = {
                total: 0,
                nbr: 0,
            }
        }

        if (!priceByState[state]) {
            priceByState[state] = {
                total: 0,
                nbr: 0
            }
        }

        qtyByState[state].avg = (qtyByState[state].total += record[2]) / ++qtyByState[state].nbr;
        priceByState[state].avg = (priceByState[state].total += record[3]) / ++priceByState[state].nbr;
    }

    for (var i=0, n=data.length; i<n; i++) {
        record = data[i];
        state = record[0];
        record.push(qtyByState[state].avg);
        record.push(priceByState[state].avg);
    }

    return data;
})()

Answer 2

这将为您提供仅包含平均数据的网格：http://jsfiddle.net/Jandalf/Wn4UY/4/

var chartStore = Ext.create('Ext.data.ArrayStore', {
    fields: ['state',  'product', 'quantity', 'price'],
    groupField: 'state',
    data: [
        ['MO','Product 1',50,40],
        ['MO','Product 2',75,50],
        ['MO','Product 3',25,60],
        ['MO','Product 4',125,70],
        ['CA','Product 1',50,50],
        ['CA','Product 2',100,40],
        ['WY','Product 1',250,40],
        ['WY','Product 2',25,50],
        ['WY','Product 3',125,86],
        ['WY','Product 4',175,83]
    ]
});

var data = [];
var quantities = chartStore.average("quantity", true);
var prices = chartStore.average("price", true);
Ext.each(chartStore.collect('state'), function(item){
    data.push({
        state: item,
        quantity: quantities[item],
        price: prices[item]
    });
});

var gridStore = Ext.create('Ext.data.Store', {
    fields: ['state', 'quantity', 'price'],
    groupField: 'state',
    data: data
});

Ext.create('Ext.grid.Panel', {
    renderTo: document.body,
    store: gridStore,
    columns: [
        { dataIndex: 'state', text: 'State' },
        { dataIndex: 'quantity', text: 'Quantity' },
        { dataIndex: 'price', text: 'Price' }
    ]
});

如果您想要一个具有不同分组的图表，您需要额外的商店，则无法定义2＆＃39;视图＆＃39;对于商店。

Extjs平均存储所有字段

2 个答案: