CODEWITHSUNDEEP
eventsextjsloadchartsmask
Lev Savranskiy
Lev Savranskiy

Reputation: 430

Extjs chart loading mask

Is there a way to mask chart while loading? LineChart has event 'afterrender', store has 'load' but it is not what i need. I see sufficient delay between them and final chart rendering. tnx

Env: extjs 3.3.1. flash

  var chart = new Ext.chart.LineChart({
                    id: 'chart1',
                    store: store,
                    xField: 'name',
                    yField: 'visits',
                  listeners: {
                    'afterrender': function() {
                      Ext.getCmp('chart1').getEl().unmask();
                    }
                }
            });

Upvotes: 0

Views: 3781

Answers (3)

A_0
A_0

Reputation: 1004

I think this will solve your problem 

store.load({
         scope: this,
        callback: function(records, operation, success) {

 Ext.getCmp('chart1').getEl().unmask();

}
});

else you can use the activate event of the chart to unmask it.

Upvotes: 0

Mitchell Simoens
Mitchell Simoens

Reputation: 2536

Why the heck would you use getCmp in an event of that Component? The function has arguments:

listeners: {
    afterrender: function(chart) {
        chart.getEl().unmask();
    }
}

Also, be mindful of memory leaks as this would keep the listener on this chart until it gets destroyed but it only renders once

listeners : {
    afterrender : {
        single : true,
        fn     : function(chart) {
            chart.getEl().unmask();
        }
    }
}

With single = true, it will remove itself after the first firing of the event. You can also put delay and pass in a number (in milliseconds) to delay the firing, buffer (not for afterrender) and pass in a number (in milliseconds) and all the same events within the number of milliseconds will be put into one event firing, scope to change the scope of the function. Some others but those are the top 4 options.

Upvotes: 1

mikec
mikec

Reputation: 3673

Try either the render or beforerender event hooks.

Upvotes: 0

Related Questions