View Full Version : Data stores for pie chart

1 Apr 2011, 1:38 AM

I'm trying to establish a xml as a data source for a circular graph but I have some problems. First of all, I noticed that the pie chart does not render correctly on different browsers (IE8, FF, Chrome), to fix it is necesary to specify the height attribute!!

The major problem is related to the data source, from Ext Designer I created a XmlStore, which loads the xml info (correctky from Ext Designer), but bounding the xmlstore to the pie chart, it doesn't render correctly.

I've done three tests. The first, with a datasource hardcoded, then with a json store and finally to the model that ext designer generates, but the latter doesn't work. It is more correct to use the first model? or is it a bug?

Here is the xml model:


And here is the example code:

var recordSG = Ext.data.Record.create([
{name: 'state', mapping: 'state'},
{name: 'total', mapping: 'total'}

var readerSG = new Ext.data.XmlReader({
record: "stats",
id: "state"
}, recordSG);

var storeSG = new Ext.data.Store({
url: 'data/grafica.xml',
autoLoad: true,
reader: readerSG

var storeSG_json = new Ext.data.JsonStore({
fields: ['state', 'total'],
data: [
state: 'OK',
total: 129
state: 'Eventos esperados',
total: 61
state: 'Erróneos',
total: 17
state: 'Inc. horario',
total: 8
state: 'Espera ref. ext.',
total: 12
state: 'Rslto. por sistema',
total: 26

var storeSG_xml = new Ext.extend(Ext.data.XmlStore, {
constructor: function(cfg) {
cfg = cfg || {};
StoreGrafica.superclass.constructor.call(this, Ext.apply({
storeId: 'varStoreGrafica',
url: 'data/grafica.xml',
autoLoad: true,
record: 'stats',
autoSave: false,
idPath: 'total',
fields: [
name: 'state',
mapping: 'state'
name: 'total',
mapping: 'total'
}, cfg));

MyContainerUi = Ext.extend(Ext.Container, {
width: 400,
height: 400,
id: 'container',
title: 'prueba',
style: 'background-color: Red; border: 1px solid Black;',
initComponent: function() {
this.items = [
store: storeSG, //storeSG -> works!, storeSG_json -> works!, storeSG_xml -> doesn't work!!!
xtype: 'piechart',
title: 'data',
dataField: 'total',
categoryField: 'state',
//extra styles get applied to the chart defaults
display: 'left',
padding: 1,
family: 'Tahoma',
size: 12

3 Apr 2011, 11:41 PM
nothing ¿?