3 * Copyright(c) 2006-2010 Ext JS, Inc.
5 * http://www.extjs.com/license
7 Ext.chart.Chart.CHART_URL = '../../resources/charts.swf';
9 Ext.onReady(function(){
11 var store = new Ext.data.JsonStore({
12 fields:['name', 'visits', 'views'],
14 {name:'Jul 07', visits: 245000, views: 3000000},
15 {name:'Aug 07', visits: 240000, views: 3500000},
16 {name:'Sep 07', visits: 355000, views: 4000000},
17 {name:'Oct 07', visits: 375000, views: 4200000},
18 {name:'Nov 07', visits: 490000, views: 4500000},
19 {name:'Dec 07', visits: 495000, views: 5800000},
20 {name:'Jan 08', visits: 520000, views: 6000000},
21 {name:'Feb 08', visits: 620000, views: 7500000}
27 title: 'ExtJS.com Visits Trend, 2007/2008 (No styling)',
28 renderTo: 'container',
39 itemclick: function(o){
40 var rec = store.getAt(o.index);
41 Ext.example.msg('Item Selected', 'You chose {0}.', rec.get('name'));
50 title: 'ExtJS.com Visits Trend, 2007/2008 (Simple styling)',
52 renderTo: 'container',
60 url: '../../resources/charts.swf',
63 yAxis: new Ext.chart.NumericAxis({
64 displayName: 'Visits',
65 labelRenderer : Ext.util.Format.numberRenderer('0,0')
67 tipRenderer : function(chart, record){
68 return Ext.util.Format.number(record.data.visits, '0,0') + ' visits in ' + record.data.name;
73 // more complex with a custom look
76 title: 'ExtJS.com Visits and Pageviews, 2007/2008 (Full styling)',
78 renderTo: 'container',
86 url:'../../resources/charts.swf',
88 yAxis: new Ext.chart.NumericAxis({
89 displayName: 'Visits',
90 labelRenderer : Ext.util.Format.numberRenderer('0,0')
92 tipRenderer : function(chart, record, index, series){
93 if(series.yField == 'visits'){
94 return Ext.util.Format.number(record.data.visits, '0,0') + ' visits in ' + record.data.name;
96 return Ext.util.Format.number(record.data.views, '0,0') + ' page views in ' + record.data.name;
101 animationEnabled: true,
126 majorTicks: {color: 0x69aBc8, length: 4},
127 minorTicks: {color: 0x69aBc8, length: 2},
128 majorGridLines: {size: 1, color: 0xeeeeee}
132 majorTicks: {color: 0x69aBc8, length: 4},
133 minorTicks: {color: 0x69aBc8, length: 2},
134 majorGridLines: {size: 1, color: 0xdfe8f6}
139 displayName: 'Page Views',
148 displayName: 'Visits',