So What Im trying to do is populate an Extjs line graph. Ive created a JSON store that pulls json from a remote page and for some reason my graph is not being populated.
Heres my Ext code:
Ext.onReady(function(){
var store = new Ext.data.JsonStore({
autoDestroy: true,
url: 'http://myURL.com',
storeId: 'graphStore',
root: 'rows',
idProperty: 'date',
fields: ['date', 'posts']
});
new Ext.Panel({
title: 'Posts',
renderTo: 'test_graph',
width:500,
height:300,
layout:'fit',
items: {
xtype: 'linechart',
store: store,
xField: 'date',
yField: 'posts',
listeners: {
itemclick: function(o){
var rec = store.getAt(o.index);
Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('date'));
}
}
}
});
});
And heres the JSON that is supposed to be populating it:
{"rows":[
{"date":"2010-06-11","posts":4},
{"date":"2010-06-12","posts":3},
{"date":"2010-06-13","posts":1},
{"date":"2010-06-14","posts":2}
]}
I cant figure out for the life of my why this wont work. The graph axis shows up, but the line doesnt render.