Hybrid View

  1. #1
    Ext JS Premium Member
    Join Date
    Oct 2011
    Posts
    41
    Vote Rating
    0
    AshNathan is on a distinguished road

      0  

    Default Multiple y-axis with line chart

    Multiple y-axis with line chart


    Hi,

    I'm trying to add multiple y-axis to a line chart and I'm not very successful. I realize that ExtJS3.4 Charts is based on YUI charts and I did see an example here: http://developer.yahoo.com/yui/examp...-dualaxes.html

    I'm unable to define the yAxes specified in the above example. I do get an error: uncaught exception: "TypeError: Error #1009"

    There is no other information on the error, I'm kind of stuck here, don't know how to proceed from here.

    This is my code:

    Code:
    var testChartStore = new Ext.data.JsonStore({
        fields: ['timestamp', 'frequency', 'grosskw', 'grosskvar'],
        data: [
            { timestamp: 'Feb 18 2:00', frequency: '25', grosskw: '100', grosskvar: '125'},
            { timestamp: 'Feb 18 2:10', frequency: '35', grosskw: '200', grosskvar: '225'},
            { timestamp: 'Feb 18 2:20', frequency: '45', grosskw: '300', grosskvar: '325'},
            { timestamp: 'Feb 18 2:30', frequency: '55', grosskw: '400', grosskvar: '425'},
            { timestamp: 'Feb 18 2:40', frequency: '65', grosskw: '500', grosskvar: '525'},
            { timestamp: 'Feb 18 2:50', frequency: '75', grosskw: '600', grosskvar: '625'},
            
            { timestamp: 'Feb 18 3:00', frequency: '125', grosskw: '1100', grosskvar: '1125'},
            { timestamp: 'Feb 18 3:10', frequency: '135', grosskw: '1200', grosskvar: '1225'},
            { timestamp: 'Feb 18 3:20', frequency: '145', grosskw: '1300', grosskvar: '1325'},
            { timestamp: 'Feb 18 3:30', frequency: '155', grosskw: '1400', grosskvar: '1425'},
            { timestamp: 'Feb 18 3:40', frequency: '165', grosskw: '1500', grosskvar: '1525'},
            { timestamp: 'Feb 18 3:50', frequency: '175', grosskw: '1600', grosskvar: '1625'}
        ]
    });
    
    var seriesDef = [
             {displayName: 'Frequency', yField: 'frequency', axis: 'secondary', style: {color:0x6238A7, size:8}},
             {displayName: 'Gross kw', yField: 'grosskw', axis: 'primary', style: {color:0x00E72E, size:8}},
             {displayName: 'Gross kvar', yField: 'grosskvar', axis: 'primary', style: {color:0xFFA329, size:8}}
        ];
        var poweraxes = new Ext.chart.NumericAxis({
            position: 'left',
            title: 'Power',
            alwaysShowZero: false
        });
        
        var poweraxes2 = new Ext.chart.NumericAxis({
            position: 'right',
            title: 'Frequency',
            alwaysShowZero: false
        });
        
        var axes = new Array();
        axes.push(poweraxes);
        axes.push(poweraxes2);
    
    {
                xtype: 'linechart',
                    store: testChartStore,
                    series: seriesDef,
                    xField: 'timestamp',
                    yAxes: axes,
                    url: 'js/charts/charts.swf'
                    
     }
    The above chart is inside a panel which is embedded inside a tab panel. Any help would be appreciated.

    Thanks

  2. #2
    Ext JS Premium Member
    Join Date
    Oct 2011
    Posts
    41
    Vote Rating
    0
    AshNathan is on a distinguished road

      0  

    Default


    Any thoughts anyone???

  3. #3
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  4. #4
    Ext JS Premium Member
    Join Date
    Oct 2011
    Posts
    41
    Vote Rating
    0
    AshNathan is on a distinguished road

      0  

    Default


    Thanks for the response.
    I got it figured, when specifying both the axis I should have specified the order for one of the axis is secondary and I missed that line.

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar