Quote Originally Posted by superstructor View Post
Are you using dynamic module loading or the full builds of sencha touch and touch charts ? I.e. What scripts did you include exactly ?
I am using dynamic loading. These are the includes on my index.html file

Code:
<link rel="stylesheet" href="/js/lib/sencha-touch-2.0.0-gpl/resources/css-debug/sencha-touch.css" type="text/css">
    <link rel="stylesheet" href="/js/lib/sencha-touch-2.0.0-gpl/src/ux/touch/grid/resources/css/Ext.ux.grid.View.css" type="text/css">
    <link rel="stylesheet" href="/css/dashboard.css" type="text/css">
    
    <link rel="stylesheet" href="/js/lib/sencha-touch-2.0.0-gpl/resources/css/touch-charts.css" type="text/css">
<!--    <link rel="stylesheet" href="../../resources/css/energy-demo.css" type="text/css">-->

    <script type="text/javascript" src="/js/lib/sencha-touch-2.0.0-gpl/sencha-touch-debug.js"></script>
    <script type="text/javascript" src="/js/lib/sencha-touch-2.0.0-gpl/touch-charts-debug.js"></script>
            
    <!-- Application Registration -->
    <script type="text/javascript" src="/js/app.js"></script>
Also, came across a new error:

Code:
Uncaught TypeError: Cannot read property 'Series' of undefined
This is the method in Chart.js that is erroring out:

Code:
series.each(function (series) {
            if (!(series instanceof Ext.chart.series.Series)) {

                series.chart = me;
                collection.add(series = Ext.create('Ext.chart.series.' + me.capitalize(series.type), series));
            }
And here is my Chart defined (almost exact copy from the EnergyApp demo)

Code:
Ext.define('APP.view.links.PageAuthority', {
    extend: 'Ext.chart.Chart',
    xtype : 'linksPageAuthority',
    config: {
        title   : 'Page Authority',
        iconCls : 'area',
        cls     : 'chartpanel',
        theme   : 'Energy',
        interactions: ['reset',{
            type: 'panzoom'
        },{
            type: 'iteminfo',
            gesture: 'tap',
            listeners: {
                show: function (interaction, item, panel) {
                    EnergyApp.popup(item, panel);
                }
            }
        }],
        animate: false,
        store: 'PABacklinks',
        axes: [{
            type: 'Numeric',
            position: 'right',
            minimum: 0,
            label: {
                renderer: APP.commify
            },
            adjustMinimumByMajorUnit: 0,
            fields: ['count1', 'count2', 'count3', 'count4', 'count5'],
            title: '# of Links'
        },{
            type: 'Category',
            position: 'bottom',
            fields: ['pa'],
            title: 'Page Authority (PA)',
            label: {
                rotate: {
                    degrees: 45
                }
            }
        }],
        legend: {
            position: Ext.os.is.Phone ? 'left' : 'top'
        },
        series: [{
            type: 'area',
            highlight: false,
            title: [],
            axis: 'right',
            xField: 'pa',
            yField: ['count1', 'count2', 'count3', 'count4', 'count5']
        }],
        listeners: {
            afterrender: function (me) {
                me.on('beforerefresh', function () {
                    if (me.ownerCt.getActiveItem().id !== me.id) {
                        return false;
                    }
                }, me);
            }
        }
    }
});
Adding this to the beginning of my class definition makes that error go away, but then I get a new error (see below). In the current beta state, is the dynamic loading not 100%? Is there standard required libraries I should define in a class?

Code:
requires: [
      'Ext.chart.series.Series'  
    ],
Code:
Uncaught TypeError: Cannot call method 'create' of undefined
Which is here in Chart.js

Code:
if (!(interaction instanceof Ext.chart.interactions.Abstract)) {
                interaction.chart = me;
                collection.add(interaction = Ext.chart.interactions.Manager.create(interaction));
Uncaught TypeError: Cannot call method 'create' of undefined
                
            }

THEN Going one step further, I made my required property for the class look like this, then got a new error:


Code:
requires: [
      'Ext.chart.series.Series',
      'Ext.chart.interactions.Manager'
    ],
Code:
"The 'reset' type has not been registered with this manager"
So finally, my requires property now looks like this:

Code:
requires: [
      'Ext.chart.series.Series',
      'Ext.chart.interactions.Reset',
      'Ext.chart.interactions.PanZoom',
      'Ext.chart.interactions.ItemInfo',
      'Ext.chart.interactions.Manager'
    ],
And a chart is rendered in my app now. (Still get that pseudo error though). Could this be considered a bug or should I be telling my app somewhere that all these chart classes need to be dynamically loaded to begin with?