PDA

View Full Version : generate random data for a store (MVC)



alex9311
27 Dec 2012, 3:10 PM
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
27 Dec 2012, 7:38 PM
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
27 Dec 2012, 7:49 PM
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
28 Dec 2012, 2:55 PM
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
28 Dec 2012, 9:37 PM
For the reloading bits, you might take a look at the charts examples in the docs. They have a ton of reload examples :)

alex9311
2 Jan 2013, 10:35 AM
got it! Thanks for pointing me in the right direction



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

Sogl
24 Apr 2016, 9:46 PM
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/


Can you help me with this example in ExtJS 3.4?
My code for 3.4:



Ext.define('TestStore', {
extend: 'Ext.data.Store',
//model: 'TestModel',
fields: [
{name: 'date'},
{name: 'number'},
{name: 'percent'}
],
storeId: 'TestStore',
generateData: function() {
var me = this,
data = [];
// generate 10 records
for( var i=0;i<10;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 ),
});
}
console.log(data);
return data;
},
randomDate: function(start, end) {
return new Date(
start.getTime() + Math.random() * (end.getTime() - start.getTime())
);
},
constructor: function() {
console.log('constructor!');
var me = this;
//me.callParent(arguments);
//me.add(me.generateData())
me.superclass.constructor.apply(me, arguments);
//me.loadData(me.generateData(), true);
me.add(me.generateData());
}
});



I have error
TypeError: record.join is not a function



But i change add to loadData, I have another error:


TypeError: this.reader is undefined

:(