1. #1
    Touch Premium Member svenna's Avatar
    Join Date
    Jun 2007
    Location
    Oslo,Norway
    Posts
    523
    Vote Rating
    22
    svenna has a spectacular aura about svenna has a spectacular aura about

      0  

    Post Chart axis labels

    Chart axis labels


    Hi,

    I'm trying to create a chart of claims pr month. I want to include 13 months in the chart (current month and last twelve).

    I'm getting the data from a json-store where I have the fields:
    yearmonth (data: 200911, 200912, 201001,....201011)
    month (data: 11,12,01,...11)
    count (data: 3,3,6,0,...3)

    Now to the issue. I want month to be displayed on the X-axis. yearmonth is included as the true unique id pr month, but the labels should be without the year.

    When scaling this down to week you really see the problem, it's not enough room for year in every label. The data is also redundant since the user always know what year we are looking at.

    I've also tried just using the month field as the x-axis, but even though the json data have to distinct entries the chart seem to overwrite the data from 200911 with the data from 201011 and include it in the position of 200911.

    I've tried playing around with xField as config param on linechart and series, but the on in series just overwrites the on in linechart. I feel like it's missing a xLabel and yLabel config parameter in linechart.

    sample code:
    Code:
    {
                xtype: 'linechart',
                store: store,
                url: '<?php print $pageconfig['RelPath'].'js/'.$Settings['Js']['Libs']['ExtJs']; ?>/resources/charts.swf',
                xLabel: 'yearmonth',
                xField: 'month',
                yField: 'count',
                yAxis: new Ext.chart.NumericAxis({
                    displayName: 'claims',
                    labelRenderer : Ext.util.Format.numberRenderer('0,0')
                }),
                series: [{
                    type: 'line',
                    displayName: 'Antall',
                    yField: 'antall',
                    xField: 'yearmonth'
                },{
                    type: 'line',
                    displayName: 'Reparasjon',
                    xField: 'yearmonth',
                    yField: 'rep'
                },{
                    type: 'line',
                    displayName: 'Deler',
                    xField: 'yearmonth',
                    yField: 'deler'
                }]
            }
    Sven Tore Iversen

  2. #2
    Touch Premium Member svenna's Avatar
    Join Date
    Jun 2007
    Location
    Oslo,Norway
    Posts
    523
    Vote Rating
    22
    svenna has a spectacular aura about svenna has a spectacular aura about

      0  

    Post


    This particular sample can be solved with, since I know that year is always 4 digits (until the year AD 10000 bug )
    Code:
    xAxis: new Ext.chart.CategoryAxis({
    	labelRenderer:function(value){  
    		return Ext.util.Format.substr(value,4,2);  
    	}
    })
    However, I hope ExtJs/Sencha have a better approach for solving the problem
    Sven Tore Iversen

Similar Threads

  1. How can i add a label for x-axis and y-axis for a chart?
    By madhu_g in forum Ext GWT: Discussion
    Replies: 7
    Last Post: 7 Jul 2014, 11:31 PM
  2. Replies: 1
    Last Post: 12 Jul 2010, 8:33 AM
  3. rotated x-axis labels
    By petko.ivanov in forum Ext GWT: Discussion
    Replies: 1
    Last Post: 27 Apr 2010, 9:09 AM
  4. Chart, no y-axis, blank?
    By MeeMMeeM in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 9 Mar 2010, 2:41 AM
  5. StackedColumnChart X Axis Some Labels Don't Show
    By mathec in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 19 Aug 2009, 9:38 AM

Tags for this Thread