How to clear chart completely in Extjs?

Question

I'm loading a store dynamically to a chart, my problem is that when the new chart is loaded, the old one (bars/lines) is still showing behind the new one. This is how I remove the old chart :

    var removeChart = function (chart) {
            var series = chart.series.items, surface = chart.surface,
                length = series.length, len = surface.groups.keys.length,
                array = [];
            for (var i = 0; i < length; i++)
                array = Ext.Array.merge(array, series[i].group.keys);
            chart.series.clear();
            for (var j = 0; j < array.length; j++){
                surface.items.getByKey(array[j]).destroy();
                };
            for (var t = 0; t < len; t++)
                surface.groups.items[t].destroy();
        };

Then I call removeChart(chart); and finally add new series config and finish with chart.redraw();

What am I doing wrong please??

Answer 1

You don't need to remove the chart to accomplish what you want.

Just reload the store, add the series, and redraw.

When you do it this way, you'll also get a cool animation (if you want animation).