Невозможно получить jSon dataStore в диаграмму ExtJS (Sencha Touch): выдает ошибку «невозможно прочитать свойство« длина »из неопределенного»
EDITED Я использую образец сенсорных диаграмм Sencha для столбчатых диаграмм. Код как ниже
<code>new Ext.chart.Panel({ fullscreen: true, title: 'Column Chart', dockedItems: [{ xtype: 'button', iconCls: 'help', iconMask: true, ui: 'plain', handler: onHelpTap }, { xtype: 'button', iconCls: 'shuffle', iconMask: true, ui: 'plain', handler: onRefreshTap }], items: { cls: 'column1', animate: { easing: 'bounceOut', duration: 750 }, store: window.store1, shadow: false, gradients: [{ 'id': 'v-1', 'angle': 0, stops: { 0: { color: 'rgb(212, 40, 40)' }, 100: { color: 'rgb(117, 14, 14)' } } }, { 'id': 'v-2', 'angle': 0, stops: { 0: { color: 'rgb(180, 216, 42)' }, 100: { color: 'rgb(94, 114, 13)' } } }, { 'id': 'v-3', 'angle': 0, stops: { 0: { color: 'rgb(43, 221, 115)' }, 100: { color: 'rgb(14, 117, 56)' } } }, { 'id': 'v-4', 'angle': 0, stops: { 0: { color: 'rgb(45, 117, 226)' }, 100: { color: 'rgb(14, 56, 117)' } } }, { 'id': 'v-5', 'angle': 0, stops: { 0: { color: 'rgb(187, 45, 222)' }, 100: { color: 'rgb(85, 10, 103)' } } }], axes: [{ type: 'Numeric', position: 'left', fields: ['wins'], minimum: 0, maximum: 10, label: { renderer: function (v) { return v.toFixed(0); } }, title: 'Wins' }, { type: 'Category', position: 'bottom', fields: ['School'], title: 'School' }], series: [{ type: 'column', axis: 'left', highlight: true, renderer: function (sprite, storeItem, barAttr, i, store) { barAttr.fill = colors[i % colors.length]; return barAttr; }, label: { field: 'wins' }, xField: 'School', yField: 'wins' }], interactions: [{ type: 'panzoom', axes: ['bottom'] }] } }); } </code>
EDITED: I am now able to load the json data when I check this in the debugger but my chart is still not getting displayed. Here is my updated code
<code>Ext.regModel('Details', { fields: [{ name: 'School' }, { name: 'wins'}] }); // create the Data Store window.store1 = new Ext.data.Store({ model: 'Details', proxy: { type: 'scripttag', url: 'http://localhost:2650/AjaxWCFService.svc/GetDataset', reader: { root: 'data', type: 'json' } }, autoLoad: true }); </code>
признателен, если кто-нибудь может дать мне знать, если я делаю что-то не так.
OLD POST: I am using a json output to bind to my Sencha Column chart. My code is as belows -
<code>Ext.regModel('details', { idProperty: 'name', fields: ['School', 'wins'] }); // create the Data Store window.store1 = new Ext.data.Store({ model: 'details', autoLoad: true, proxy: { type: 'ajax', method: 'POST', url: 'http://localhost:2650/AjaxWCFService.svc/GetDataset', reader: { type: 'json', root: 'data' } }, listeners: { load: function (obj, records) { Ext.each(records, function (rec) { console.log(rec.get('name')); }); } } }); </code>
Это данные JSON, которые возвращаются из URL
<code>{ data: [ {School:'Dukes',wins:'3'}, {School:'Emmaus',wins:'10'}, {School:'Maryland',wins:'5'}, {School:'Virginia',wins:'2'} ] } </code>
Но это не отображает график, вместо этого я получаю ошибку javascript & quot; Ошибка типа uncaught: невозможно прочитать длину свойства undefined & quot; в файле sencha-touch.js.
Если я жестко закодирую данные из вывода json напрямую, то это сработает
<code>window.store1 = new Ext.data.JsonStore({ root: 'data', fields: ['School', 'wins'], autoLoad: true, data: [ {School:'Dukes',wins:'3'}, {School:'Emmaus',wins:'10'}, {School:'Maryland',wins:'5'}, {School:'Virginia',wins:'2'} ] }); </code>
Также, когда я загружаю jsonStore из ExtDesigner, он работает нормально. Когда я копирую тот же код в свой файл Secha charts index.js, он не работает.
Может кто-нибудь, пожалуйста, дайте мне знать, что я делаю неправильно в моем коде?