Results 1 to 2 of 2

Thread: Sencha Line Chart Issue

  1. #1
    Sencha Premium Member
    Join Date
    Dec 2013
    Posts
    3

    Default Sencha Line Chart Issue

    I am using Line Chart (ExtJs Version 4.2) Bellow is the source code for that.Is there any way to display the label group by YEAR in X-Axis.I tried using label render-er function that did not work

    Any help is much appreciated.

    Ext.define('MyApp.view.page.MyChart', {
    extend : 'Ext.panel.Panel',
    overflowY : 'auto',
    layout : 'fit',
    height : 150,
    alias : 'widget.my-line-chart',
    initComponent : function() {
    var me = this;
    var myLineChart = Ext.create('Ext.chart.Chart', {
    animate : false,
    shadow : false,
    store : 'line-chart-store',
    axes : [ {
    type : 'Numeric',
    position : 'left',
    fields : ['ySeries'],
    title : false,
    minorTickSteps : 1,
    grid: true,
    minimum: 0,
    label: {
    font:'11px Arial, Helvetica, sans-serif'
    }
    }, {
    type: 'Time',
    position: 'bottom',
    fields: ['xSeries'],
    dateFormat: 'M Y',
    step: [Ext.Date.MONTH,6],
    minorTickSteps : 1,
    label:{
    font:'11px Arial, Helvetica, sans-serif'
    }

    }],
    series : [{
    type : 'line',
    axis : 'left',
    xField : 'xSeries',
    yField :['ySeries'],
    smooth: true,
    markerConfig: {
    type: 'circle',
    size: 2,
    radius: 2,
    'stroke-width': 0
    }
    }]
    });
    this.items =[myLineChart];
    me.callParent(arguments);
    }
    });

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,409
    Answers
    716

    Default

    Renderer is not going to change how it groups, but only how it displays. You would need to convert that data first at the store.

    See 'convert' to create calculated field that is by year.
    http://docs.sencha.com/extjs/4.2.3/#...ld-cfg-convert

Posting Permissions

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