1. #1
    Sencha User
    Join Date
    Feb 2010
    Posts
    11
    Vote Rating
    0
    extDev is on a distinguished road

      0  

    Default Stacked Column Chart in Ext JS

    Stacked Column Chart in Ext JS


    Hi folks,
    I need to create a stacked column chart with ExtJS like that http://developer.yahoo.com/yui/examp...-rotation.html I tried and wasted hours on it, because Ext really lacks on chart documentation.

    I tried to create a chart for this store data

    { year: 2010, x: 5, y: 3 }
    { year: 2009, x: 8, y: 6 }

    And I have got nothing. Any advice, code snippet?

    Thanks in advance.

    Fatih.

  2. #2
    Ext JS Premium Member Nigel's Avatar
    Join Date
    Nov 2008
    Location
    Hampshire, England
    Posts
    57
    Vote Rating
    2
    Nigel is on a distinguished road

      0  

    Default


    Fatih

    You need
    PHP Code:
        type'stackcolumn',
        
    yAxis: new Ext.chart.NumericAxis({
            
    stackingEnabledtrue
        
    }) 
    within your config when setting up the chart.

    Good luck!

  3. #3
    Sencha User darthwes's Avatar
    Join Date
    Mar 2010
    Posts
    633
    Vote Rating
    -13
    darthwes can only hope to improve

      0  

    Default


    Code:
    var chartCfg = {
        xtype: 'stackedcolumnchart',
        store: new Ext.data.JsonStore({
            fields: [{
                name: 'year',
                type: 'int'
            },
            {
                name: 'x',
                type: 'int'
            },
            {
                name: 'y',
                type: 'int'
            }],
            data: [{
                year: 2010,
                x: 5,
                y: 3
            },
            {
                year: 2009,
                x: 8,
                y: 6
            }]
        }),
        xField: 'year',
        xAxis: new Ext.chart.CategoryAxis({
            title: 'The X Axis',
            minimum: 2005,
            maximum: 2015
        }),
        yAxis: new Ext.chart.NumericAxis({
            title: "The Y Axis",
            minimum: 2,
            maximum: 10
        }),
        series: [{
            displayName: "X",
            yField: 'x'
        },
        {
            displayName: "Y",
            yField: 'y'
        }],
        chartStyle: {
            padding: 10,
            legend: {
                display: 'right'
            }
        }
    };
    new Ext.Viewport({
        layout: 'vbox',
        layoutConfig: {
            align: 'stretch'
        },
        defaults: {
            flex: 1
        },
        items: [chartCfg,
        {
            html: "Word"
        }]
    });
    That oughtta set it out for you. Good luck.
    Wes

Similar Threads

  1. Location of Keys in stacked bar chart
    By lalit_lmc in forum Ext GWT: Discussion
    Replies: 0
    Last Post: 3 Dec 2010, 3:59 AM
  2. Stacked Bar Chart with many elements and small bars
    By raz0r1 in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 27 Aug 2010, 7:48 AM
  3. Stacked bar chart layout
    By Jba in forum Ext GWT: Discussion
    Replies: 0
    Last Post: 26 May 2010, 2:12 AM
  4. Stacked Bar Chart - bars size
    By webgunz in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 14 Mar 2010, 8:17 AM
  5. ChartListener for Stacked bar chart
    By kamisama in forum Ext GWT: Discussion
    Replies: 7
    Last Post: 4 Feb 2010, 12:39 PM

Thread Participants: 2

Tags for this Thread

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