Results 1 to 2 of 2

Thread: Two-column bar chart

  1. #1

    Default Two-column bar chart

    I would like to make a two-column bar chart proof of concept; a non-ExtJS example of a multi-column bar chart is at the top left example of http://www.highcharts.com/.

    At present, from looking at the charts demo, I am able to get basically a blank, white-with-light-blue-border rectangular area on my page, but no data plotted into it. The JavaScript console doesn't show any errors.

    How can I make a two-column bar chart?

    Thanks,
    ? Jonathan Hayward, [email protected]
    ? An Orthodox Christian author: theology, literature, et cetera.
    ? My award-winning collection is available for free reading online:
    ? I invite you to visit my main site at http://JonathansCorner.com/

  2. #2

    Default My code

    My code is:

    Code:
            <div id="os_container"></div>
            <div id="vol_container"></div>
            <script language="JavaScript" type="text/javascript"
              src="/extjs/adapter/ext/ext-base.js">
            </script>
            <script language="JavaScript" type="text/javascript"
              src="/extjs/ext-all.js">
            </script>
            <script language="JavaScript" type="text/javascript">
                <!--
                Ext.chart.Chart.CHART_URL = '/extjs/resources/charts.swf';
                var os = new Ext.data.JsonStore({
                    "fields": ["month", "2010", "2011"],
                    "data": [
                        {"month": "Current", "2010": 1, "2011": 3},
                        {"month": "February", "2010": 2, "2011": 4},
                        {"month": "January", "2010": 1, "2011": 3},
                        {"month": "December", "2010": 2, "2011": 4},
                        {"month": "November", "2010": 1, "2011": 3},
                        {"month": "October", "2010": 2, "2011": 4}
                        ]
                    });
                var vol = new Ext.data.JsonStore({
                    "fields": ["month", "2010", "2011"],
                    "data": [
                        {"month": "Current", "2010": 1, "2011": 2},
                        {"month": "February", "2010": 3, "2011": 4},
                        {"month": "January", "2010": 1, "2011": 2},
                        {"month": "December", "2010": 3, "2011": 4},
                        {"month": "November", "2010": 1, "2011": 2},
                        {"month": "October", "2010": 3, "2011": 4}
                        ]
                    });
                new Ext.Panel({
                    iconCls: 'chart',
                    title: 'O/S for 2010 and 2011',
                    frame: true,
                    renderTo: 'os_container',
                    store: os,
                    width: 550,
                    height: 300,
                    layout: 'fit',
                    url: '/extjs/resources/charts.swf',
                    items: {
                        store: os,
                        xtype: 'stackedcolumnchart',
                        xField: 'month',
                        yField: '2011',
                        yAxis: new Ext.chart.NumericAxis({
                            displayName: 'Visits',
                            labelRenderer: Ext.util.Format.numberRenderer('0,0')
                            }),
                        series: [{type: 'line',
                            displayName: 'O/S 2010',
                            yField: '2010',
                            style: { color: 0x800000 }
                            }, {
                            type: 'line',
                            displayName: 'O/S 2011',
                            yField: '2011',
                            style: { color: 0x008000 }
                            }]}
                        });
                // -->
            </script>
    ? Jonathan Hayward, [email protected]
    ? An Orthodox Christian author: theology, literature, et cetera.
    ? My award-winning collection is available for free reading online:
    ? I invite you to visit my main site at http://JonathansCorner.com/

Similar Threads

  1. Replies: 1
    Last Post: 24 Mar 2011, 11:05 AM
  2. Stacked Column Chart in Ext JS
    By extDev in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 7 Jan 2011, 2:30 PM
  3. Chart several line in one column
    By Mycoding in forum Ext 3.x: Help & Discussion
    Replies: 4
    Last Post: 12 Dec 2010, 9:31 AM
  4. column chart color
    By dusoo in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 25 Aug 2010, 12:50 AM
  5. Could Column chart colorful?
    By shane_china in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 19 May 2009, 6:22 PM

Posting Permissions

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