1. #1
    Sencha User Mycoding's Avatar
    Join Date
    May 2010
    Location
    Russia, Volgograd
    Posts
    460
    Vote Rating
    0
    Mycoding is on a distinguished road

      0  

    Default Chart several line in one column

    Chart several line in one column


    Please give me advice.
    I need to do like this

    I mean chart with several column and in each column several parametr.
    At the moment I have this like

    But I need that less bar was over large bar.

    Code:
    			iconCls:'chart',
    			title: 'Статистика посещений',			
    			height:300,
    			frame:true,
    			//layout:'fit',
    			items: [{
    				xtype: 'columnchart',				  
    				url:'../resources/charts.swf',
    				store: store,				
    				xField: 'day',
    				yAxis: new Ext.chart.NumericAxis({
    					displayName: 'unique_open_time',										
    					labelRenderer : Ext.util.Format.numberRenderer('0,0')
    				}),				
    				tipRenderer : function(chart, record, index, series){
    					if(series.yField == 'unique_open_time'){
    						return Ext.util.Format.number(record.data.unique_open_time, '0,0') + ' уникальных просмотров ' + record.data.day;
    					}else{
    						return Ext.util.Format.number(record.data.open_time, '0,0') + ' просмотров ' + record.data.day;
    					}
    				},
    				chartStyle: {
    					padding: 10,
    					animationEnabled: true,
    					font: {
    						name: 'Tahoma',
    						color: 0x444444,
    						size: 11
    					},
    					dataTip: {
    						padding: 5,
    						border: {
    							color: 0x99bbe8,
    							size:1
    						},
    						background: {
    							color: 0xDAE7F6,
    							alpha: .9
    						},
    						font: {
    							name: 'Tahoma',
    							color: 0x15428B,
    							size: 10,
    							bold: true
    						}
    					},
    					xAxis: {
    						color: 0x69aBc8,
    						majorTicks: {color: 0x69aBc8, length: 4},
    						minorTicks: {color: 0x69aBc8, length: 2},
    						majorGridLines: {size: 1, color: 0xeeeeee}
    					},
    					yAxis: {
    						color: 0x69aBc8,
    						majorTicks: {color: 0x69aBc8, length: 4},
    						minorTicks: {color: 0x69aBc8, length: 2},
    						majorGridLines: {size: 1, color: 0xdfe8f6}
    					}
    				},
    				series: [{
    					type: 'column',
    					displayName: 'Page open_time',
    					yField: 'open_time',
    					style: {
    						image:'images/bar.gif',
    						mode: 'stretch',
    						color:0x99BBE8
    					}
    				},{
    					type: 'column',
    					displayName: 'Page open_time',
    					yField: 'unique_open_time',
    					style: {
    						//image:'images/bar.gif',
    						mode: 'stretch',
    						color:0xf7adc0
    					}				
    				}]
    			}]

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,507
    Vote Rating
    56
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    I think you want one of these: http://dev.sencha.com/deploy/dev/doc...kedColumnChart

    There is a stacked bar chart example in the examples directory which is the same principle.

  3. #3
    Sencha User Mycoding's Avatar
    Join Date
    May 2010
    Location
    Russia, Volgograd
    Posts
    460
    Vote Rating
    0
    Mycoding is on a distinguished road

      0  

    Default


    Thaks a lot for link.
    I did it but I need another thing.

    I mean.
    Example:
    For day page is opened 1000 times from them unique ip is 200 and users who registed are
    50, and 10 who payed for month.
    I need that at first paint 1000 than on it 200 (OVER 1000 but NOT AFTER IT) and so on.

    As far as I understand that is not possible?

    Sorry for trubling you.

    I get now this

    but I need this

  4. #4
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,664
    Vote Rating
    7
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    this type doesn't exists, and i have never seen such type anywhere else. i think best way to draw this is using line chart.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,507
    Vote Rating
    56
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You will have to process the values to stack up in that way. It should be possible.

Similar Threads

  1. Line Chart
    By akumariiit in forum Ext 3.x: Help & Discussion
    Replies: 12
    Last Post: 2 Nov 2010, 4:18 AM
  2. Line chart - two line - different x values
    By mauro.onida in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 31 Oct 2010, 1:56 AM
  3. draw two line in one line chart
    By m4eclipse in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 28 Sep 2010, 2:13 AM
  4. [SOLVED] Line Chart: how to show only line without points ?
    By yyogev in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 19 Jul 2010, 4:01 AM
  5. Line Chart
    By neerajnandwana in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 23 Feb 2010, 10:49 PM

Thread Participants: 2