sencha touch: real time chart -

i using sencha touch show chart , add data store of chart dynamically.but when add data store, chart not update result. code of chart:

ext.define('myapp.view.mylinechart1', { extend: 'ext.chart.cartesianchart',  requires: [     'ext.chart.axis.category',     'ext.chart.axis.numeric',     'ext.chart.series.line' ],  config: {     itemid: 'xy',     store: 'mystore',     colors: [         '#115fa6',         '#94ae0a',         '#a61120',         '#ff8809',         '#ffd13e',         '#a61187',         '#24ad9a',         '#7c7474',         '#a66111'     ],     axes: [         {             type: 'category',             fields: [                 'x'             ],             maximum: 5,             minimum: 0         },         {             type: 'numeric',             fields: [                 'y'             ],             grid: {                 odd: {                     fill: '#e8e8e8'                 }             },             position: 'left'         }     ],     series: [         {             type: 'line',             colors: 'rgba(0,200,0,0.3)',             style: {                 smooth: true,                 stroke: 'rgb(0,200,0)',              },             xfield: 'x',             yfield: 'y'         }     ],     listeners: [         {             fn: 'onchartshow',             event: 'show',             order: 'after'         }     ] },  onchartshow: function(component, eopts) {     var taskrunner = ext.create("myapp.controller.taskrunner");     chart = ext.componentquery.query("#xy")[0];     store = chart.getstore();      chart.animationsuspended = true;     chart.update();     store.removeall();     this.timecharttask = taskrunner.start({         run: this.update_chart,         interval: 1000,         repeat: 10,         scope:     });  },  update_chart: function(chart) {     var me = this;     chart = ext.componentquery.query("#xy")[0];     store = chart.getstore();     count = store.getcount();     xaxis = chart.getaxes()[0];     visiblerange = 10000;     second = 1000;     console.log(xaxis.getminimum());      if (count > 0) {         lastrecord = store.getat(count - 1);         xvalue = lastrecord.get('x') + second;         if (xvalue - me.starttime > visiblerange) {             me.starttime = xvalue - visiblerange;             xaxis.setminimum(this.starttime);             xaxis.setmaximum(xvalue);             console.log("count >0");         }         store.add({             x: xvalue,             y: me.getnextvalue()         });         //             store.load();         chart.redraw();       } else {         chart.animationsuspended = true;         me.starttime = math.floor(ext.date.now() / second) * second;         xaxis.setminimum(me.starttime);         xaxis.setmaximum(me.starttime + visiblerange);          store.add({             x: this.starttime,             y: me.getnextvalue()         });         chart.animationsuspended = false;         //             store.load();         chart.redraw();         console.log("count < 0");     } },  getnextvalue: function(previousvalue) {     var delta = math.random()*4 - 2;     if (ext.isnumber(previousvalue)) {         return ext.number.constrain(previousvalue + delta, -2, 2);     }     return math.random()*4 - 2; } 

});

this store:

ext.define('myapp.store.mystore', { extend: 'ext.data.store',  requires: [     'myapp.model.mymodel1' ],  config: {     model: 'myapp.model.mymodel1',     storeid: 'mystore' } 

});

and model:

ext.define('myapp.model.mymodel1', { extend: 'ext.data.model',  requires: [     'ext.data.field' ],  config: {     fields: [         {             name: 'x'         },         {             name: 'y'         }     ] } 

});

if want set data store use code:

    var store = ext.getstore('mystore');     store.load(function () {         var store = ext.getstore('mystore');         store.removeall();          store.add({             x: xvalue,             y: me.getnextvalue()         });         store.sync();     });