generate random data for a store (MVC)

[alex9311]

Hey all,
I'm trying to generate a random data set for a store but I'm having trouble. My generator function is undefined, I'm probably declaring it in the wrong place/way or calling it in the wrong way. Here is my code (for my store file).

Ext.define('TR.store.Trends', {
        extend: 'Ext.data.Store',
        model: 'TR.model.Trends',
        generateData : function(){
                var data = [];
                //logic to populate  data array missing, for now I am just
                //pushing a single entry
                data.push({
                        name: '2012-12-10',
                        number: 10,
                        percent: 8.7,
                });
                return data;
        },
        data:this.generateData(),
});

Any help on this is much appreciated

[vietits]

At defining time of TR.store.Trends, 'this' is often window or some other object, not the store instance which will be existed only when you create an instance of the store. So this.generateData will often be undefined.
Try to fix your code as below:

Ext.define('TR.store.Trends', {
    extend: 'Ext.data.Store',
    model: 'TR.model.Trends',
    generateData : function(){
        var data = [];
        //logic to populate  data array missing, for now I am just
        //pushing a single entry
        data.push({
            name: '2012-12-10',
            number: 10,
            percent: 8.7,
        });
        return data;
    },
    // data:this.generateData(),
    constructor: function(){
        this.data = this.generateData();
        this.callParent(arguments);
    }
});

[existdissolve]

You might try something like this:

Ext.define('TestStore', {
    extend: 'Ext.data.Store',
    model: 'TestModel',
    storeId: 'TestStore',
    generateData: function() {
        var me = this,
            data = [];
        // generate 50 records
        for( var i=0;i<50;i++) {        
            data.push({
                date: me.randomDate(new Date(2012, 0, 1), new Date()),
                number: Math.floor( Math.random() * 1000 ),
                percent: ( ( Math.random() * 1000 ) / 3.2 ).toFixed( 1 ),
            });
        }
        return data;
    },
    randomDate: function(start, end) {
        return new Date(
            start.getTime() + Math.random() * (end.getTime() - start.getTime())
        )
    },
    constructor: function() {
        var me = this;
        me.callParent(arguments);
        me.add(me.generateData())
    }
}); 

Here's a live example: http://jsfiddle.net/existdissolve/8NMJG/

[alex9311]

Thank you both for your help, I got my store working and generating decent random data. Here is what I ended up using:

Ext.define('TR.store.Trends', {
        extend: 'Ext.data.Store',
        model: 'TR.model.Trends',
        generateData: function() {
                var     me = this,
                        data = [],
                        currentDate = new Date(),
                        total = Math.floor((Math.random()*400)+100),
                        whatsLeft = total,
                        newpercent = 0;
                var sample = 20;
                for( var i=0;i<sample;i++) {
                        var newnumber = Math.floor((Math.random()*(whatsLeft)/(sample/4))+0);
                        whatsLeft = whatsLeft - newnumber;
                        newpercent = newpercent + ((newnumber/total)*100);
                        var newDate = new Date();
                        newDate.setDate(currentDate.getDate()+i);
                        data.push({
                                date: newDate,
                                number: newnumber,
                                percent: newpercent,
                        });
                }
                return data;
        },
        constructor: function() {
                var me = this;
                me.callParent(arguments);
                me.add(me.generateData())
        }
});

Now my follow up challenge is making a button to "reload" the store on the chart, displaying a new set of random data. I havn't spent a ton of time on this yet but I'm guessing stores have some sort of a reload or refresh methon

[existdissolve]

For the reloading bits, you might take a look at the charts examples in the docs. They have a ton of reload examples

[alex9311]

got it! Thanks for pointing me in the right direction

        reload:function(button){
                var store = Ext.data.StoreManager.lookup('Trends');
                store.loadData(store.generateData());
        }