Ext.chart.Chart cannot read property 'length' of undefined

[aaronlk]

Hi,
I am trying to create a bar chart using Ext.chart.Chart for an application I've just inherited, but I am consistently getting an error when trying to build the chart initially.

Uncaught TypeError: Cannot read property 'length' of undefined

This error specifically is thrown when I am trying to create my axes or series; if I do not define the axes or series (ie, do not draw the chart) and only bind a store, it seems to load correctly. Since not even one axis can be configured without throwing the error, I'm facing a blank in how to approach the error, especially as the trace seems to call hasLockedColumns in Ext.panel.Table, which I am not using at all.

Here is my code:

comp.add({            region: 'center',
            cls:'mainbg',
            xtype: 'panel',
            items: [{
                xtype: 'chart',
                store: {
                    type: 'barchartstore',
                    autoLoad: true,
                    listeners: {
                        load: function(){
                            console.log("loading store");
                        }
                    }
                },
                axes: [{
                    type: 'Numeric',
                    fields: ['Percentage'],
                    position: 'left'


                }
]

            }]

I am receiving this error regardless of if I am building it dynamically, in its own component file, or directly in the viewport. Data in the store is automatically loaded by an proxy in JSON format, and a console.log shows it to be loaded in the store during the chart's beforerender listener.

Thanks for the help!

[aaronlk]

Update on the problem! I was able to fix the error I was getting. Turns out the root of the problem was just a simple missing requires, after tons of searching for clues. Since I inherited this application from another owner, I completely disregarded a requires as a potential problem.

I was able to solve the problem by adding this:

requires: [
		'Ext.chart.*',
		'Ext.chart.series.Column',
		'Ext.chart.axis.Category',
		'Ext.chart.axis.Numeric',
		'Ext.form.Panel',
		'Ext.layout.container.Column',
		'Ext.form.field.*',
		'Ext.form.FieldSet',
		'Ext.grid.column.*',
		'Ext.grid.Panel',
		'Ext.tab.Panel'],

I copied this requires from an answer given https://www.sencha.com/forum/showthr...ed-application at this thread into my component, and it seems to have solved the errors I was getting. Additionally, I had to define all of my axes as well as the series; if any of these were left undefiend, it would throw errors as well.

[Gary Schlosberg]

Glad to hear you found the solution, and thanks for sharing your findings with the community. You may not need all of those classes in your 'requires' config, so depending on your application you might lighten the load by removing some of them. Ideally you'll want to match them up with the classes you are using in your application.