Results 1 to 1 of 1

Thread: Ext 3.2.1 Stacked Column Chart problem

  1. #1
    Sencha User
    Join Date
    Sep 2008
    Posts
    81

    Default Ext 3.2.1 Stacked Column Chart problem

    I am trying to create a stacked column chart with Ext 3.2.1 (vertically piled up data), however it doesn't display any data. I found some sample code but they are either stacked bar (horizontal piled up data) or work with Ext 4. Below is my data and code... Also attached the output screenshot and what I want to achieve at the end. No errors in Firebug

    Code:
    var storeConfig = {
                    autoLoad: false,
                    fields: ['period', 'ontime', 'late'],
                    proxy: {
                        type: 'memory',
                        reader: {
                            type: 'json',
                            root: 'data'
                        }
                    },
                    data: []
                };
                var store1 = new Ext.data.Store(storeConfig);
    
                store1.loadData([{ period: '2012-01', ontime: 123, late: 500 }, 
                                { period: '2012-02', ontime: 564, late: 463},
                                { period: '2012-03', ontime: 5, late: 46},
                                { period: '2012-04', ontime: 250, late: 463},
                                { period: '2012-05', ontime: 123, late: 463},
                                { period: '2012-06', ontime: 12, late: 463},
                                { period: '2012-07', ontime: 0, late: 463},
                                { period: '2012-08', ontime: 1400, late: 463},
                                { period: '2012-09', ontime: 1200, late: 950},
                                { period: '2012-10', ontime: 680, late: 695},
                                { period: '2012-11', ontime: 222, late: 222},
                                { period: '2012-12', ontime: 111, late: 333},
                ], false);
    Code:
    var configOptions = 
    {
        store: store1,
        axes: [
            {
                title: 'Period',
                type: 'Numeric',
                position: 'left',
                fields: ['ontime','late'],
            },
            {
                type: 'Category',
                position: 'bottom',
                fields: ['period'],
                grid: true,
                  label: {
                  rotate: {
                    degrees: 90
                  }
                }
            }
        ],
        series: [
            {
                type: 'column',
                colorSet: ['#00FF00','#FF0000'],
                //highlight: true,
                //column: true,
                stacked: true,
                xField: 'period',
                yField: ['ontime','late']
            }
        ] 
    };
    
    summaryComponent = new Ext.chart.StackedColumnChart(configOptions);
    Attached Images Attached Images

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •