PDA

View Full Version : "c is not a constructor" when trying to draw chart.



RiaanSA
25 Mar 2012, 11:41 PM
Hi,

I have been working through a couple of examples but I always get the same message.

Looking at fire-bug error message it says.

"c is not a constructor" in "/extjs/src/data/JsonStore.js"

This is my example code.


Ext.require('Ext.container.Viewport');


Ext.application({
name: 'DataShed',
autoCreateViewPort: true,


appFolder: 'DataShedOnline',

launch: function() {
//BAR Chart
Ext.require('Ext.chart.*');

var store = Ext.create('Ext.data.JsonStore', {
fields:['name', 'age'],
data:[
{name:'Lioane', age: 25},
{name:'Peter', age: 24},
{name:'Claudia', age: 30},
{name:'John', age: 28},
{name:'Steve', age: 32}
]
});

Ext.create('Ext.window.Window', {
title:'Friends x Age',
width:500,
height:300,
layout:'fit',
maximizable:true,
items: {
xtype:'chart',
style:'background:#fff',
animate:true,
shadow:true,
store: store,

axes: [{
type:'Numeric',
position:'left',
fields: ['age'],
title:'Age',
grid: true,
minimum: 0
},
{
type: 'Category',
position: 'bottom',
fields:['name'],
title: 'Friends Name'
}],

legend:{
position: 'right'
},
series: [{
type: 'column',
axis: 'left',
highlight: true,
tips: {
trackMouse: true,
width:140,
height:28,
renderer: function(storeitem, item) {
this.setTitle(storeItem.get('name') + ': ' + storeItem.get('age'));
}
},
xField: 'name',
yField: 'age',
showInLegend: true
}]
}
}).show();
//---------------
}
});


This is my first app in ExtJs so it's probably a stupid mistake.

RiaanSA
26 Mar 2012, 12:13 AM
Think I found the solution.

I need to add
Ext.require(['Ext.Window', 'Ext.fx.target.Sprite', 'Ext.layout.container.Fit']);

I am not an expert on Ext.require yet. Any recommendations? Should I always add Ext.require for all my classes for example viewport and panels?

The working code look's like this.

Ext.require('Ext.container.Viewport');
Ext.require('Ext.chart.*');
Ext.require(['Ext.Window', 'Ext.fx.target.Sprite', 'Ext.layout.container.Fit']);


Ext.application({
name: 'DataShed',
autoCreateViewPort: true,


appFolder: 'DataShedOnline',

launch: function() {
//BAR Chart
var store = Ext.create('Ext.data.JsonStore', {
fields:['name', 'age'],
data:[
{name:'Lioane', age: 25},
{name:'Peter', age: 24},
{name:'Claudia', age: 30},
{name:'John', age: 28},
{name:'Steve', age: 32}
]
});

Ext.create('Ext.window.Window', {
title:'Friends x Age',
width:500,
height:300,
layout:'fit',
maximizable:true,
items: {
xtype:'chart',
style:'background:#fff',
animate:true,
shadow:true,
store: store,

axes: [{
type:'Numeric',
position:'left',
fields: ['age'],
title:'Age',
grid: true,
minimum: 0
},
{
type: 'Category',
position: 'bottom',
fields:['name'],
title: 'Friends Name'
}],

legend:{
position: 'right'
},
series: [{
type: 'column',
axis: 'left',
highlight: true,
tips: {
trackMouse: true,
width:140,
height:28,
renderer: function(storeItem, item) {
this.setTitle(storeItem.get('name') + ': ' + storeItem.get('age'));
}
},
xField: 'name',
yField: 'age',
showInLegend: true
}]
}
}).show();
//---------------
}
});


O yes there where a problem in previous code I misspelled "storeItem" on the renderer function, though it was not the main cause of the problem.