Redraw Line chart doesn't work (touch-charts-2.0.0-beta)

[KamenRiderJD]

Hi, everyone!

I'm new in sencha touch.
I'm trying to redraw a 'line' chart after setting new series but it doesn't work.
(It works for 'column' and 'area' charts !)

var myData = [
{name:'Name1', 2010:100, 2011:115, 2012:130},
{name:'Name2', 2010:80, 2011:70, 2012:60},
{name:'Name3', 2010:150, 2011:40, 2012:90}
];


function createStore(){
    return Ext.create('Ext.data.Store', {
        fields: ['name', '2010', '2011', '2012'],
        data: myData
    });
}


var serieLine1 = [{ type: 'line', highlight: { size: 7, radius: 7 }, smooth: true, axis: 'left', xField: 'name', yField: ['2010'], title: 'toto1' }];


var serieLine2 = [{ type: 'line', highlight: { size: 7, radius: 7 }, smooth: true, axis: 'left', xField: 'name', yField: ['2010'], title: 'toto1' },
            { type: 'line', highlight: { size: 7, radius: 7 }, smooth: true, axis: 'left', xField: 'name', yField: ['2011'], title: 'toto2' },
            { type: 'line', highlight: { size: 7, radius: 7 }, smooth: true, axis: 'left', xField: 'name', yField: ['2012'], title: 'toto3' }];


Ext.setup({


    onReady: function() {
        var chart = Ext.create('Ext.chart.Chart', {
            theme: 'Demo',
            store: createStore(),
            animate: true,
            id: 'chartCmp',
            legend: {
                position: {
                    portrait: 'right',
                    landscape: 'bottom'
                },
                labelFont: '20px Arial'
            },
            axes: [
                {
                    type: 'Numeric',
                    position: 'left',
                    fields: ['2010'],
                    title: 'Number of Hits',
                    minimum: 0,
                    adjustMinimumByMajorUnit: 0
                },
                {
                    type: 'Category',
                    position: 'bottom',
                    fields: ['name'],
                    title: 'Month of the Year'
                }
            ],
            series: serieLine1,
            interactions: [
                {
                    type: 'panzoom',
                    axes: ['bottom', 'left']
                }
            ]
        });
        
        Ext.create('Ext.chart.Panel', {
            id: 'panelCmp',
            fullscreen: true,
            title: 'Line',
            chart: chart
        });        


    }
});

It's ok. But when I try to set the new serie serieLine2 like this:

var chart = Ext.getCmp('chartCmp');
chart.getAxes().items[0]._fields = ['2010', '2011', '2012'];
chart.setSeries(serieLine2);
chart.redraw(false);  /* or chart.refresh() */

it doesn't work. I have this error:

Error
line: 4167
message: "'undefined' is not an object (evaluating 'this.getGroup(group).add')"
sourceId: 4986444928
sourceURL: "file:/// ... /touch-charts.js"

I think it's because, for Line chart, chart.getSeries().drawSeries() doesn't work.

Do you have an idea to make it possible ?

Thanks,
JD

[mitchellsimoens]

I would suggest upgrading your app to ST 2.1. Touch Charts is deprecated and won't be developed on at all. ST 2.1's charts have been completely rewritten.

Also, this forum is for the ST 1's charts.

[KamenRiderJD]

Oh Ok!
I work with ST 2.1.1 (sorry for the wrong forum) but I actually use the free commercial version and chart is not included (directory src/chart is empty). So I worked with Touch Chart.

I just take the GPL version and chart is included. I will try with this one.

Thanks for replying.
JD

[mitchellsimoens]

To get the commercial version of the charts you would need to purchase Sencha Complete : https://www.sencha.com/store/sencha-complete/

Remember, if you use GPL, you're whole application is now GPL

[KamenRiderJD]

I know.
For the moment, I have to make a simple iPad application to present Sencha (especially Charts).

Thanks