1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    15
    Vote Rating
    1
    Answers
    1
    Carlos_hb is on a distinguished road

      0  

    Default Unanswered: Line chart time axis problem with times between 12:00 AM and 1:00 AM

    I'm having a bug with a line chart in extjs 4.2.1
    I want to display a chart that displays info through time so the bottom axis is set to 'Time', but when I have a data with time 12:00AM and the next one at 1:00 AM the chart graphs the 1:00AM like the first one like this
    bugChart.jpg
    Note that the one from the left goes next to the last at right; the problem only occurs with remote data
    Here is my JSON:
    Code:
    [   {
    
    
          "datetime":"2013-09-22T00:47:50.26",
          "tank1":"378.254",
          "tank2":"315.619",
          "tank3":"",
          "tank4":"",
          "total":"693.873"
       },
       {
          "datetime":"2013-09-22T00:52:51.123",
          "tank1":"378.23",
          "tank2":"315.6",
          "tank3":"",
          "tank4":"",
          "total":"693.83"
       },
       {
          "datetime":"2013-09-22T00:57:51.77",
          "tank1":"378.227",
          "tank2":"316.118",
          "tank3":"",
          "tank4":"",
          "total":"694.345"
       },
       {
          "datetime":"2013-09-22T01:02:52.633",
          "tank1":"378.018",
          "tank2":"316.911",
          "tank3":"",
          "tank4":"",
          "total":"694.929"
       }
    ]
    My store:
    Code:
    var myStore = new Ext.data.Store({    fields: ['datetime','tank1','tank2',tank3','total']
    
    });
    And the chart:
    Code:
    xtype: 'panel',width: '100%',
    flex: 2,
    border: false,
    layout: 'fit',
    items: [{
        xtype: 'chart',
        animate: true,
        store: myStore,
        legend: {
            position: 'right'
        },
        axes: [{
            type: 'Numeric',
            grid: true,
            position: 'left',
            fields: ['total'],
        }, {
            type: 'Time',
            position: 'bottom',
            dateFormat: 'G:i',
            step: [Ext.Date.MINUTE, 1],
            fields: ['datetime'],
            label: {
                rotate: {
                    degrees: 45
                }
            }
        }],
        series: [{
            type: 'line',
            smooth: true,
            highlight: true,
            selectionTolerance: 5,
            xField: 'datetime',
            yField: 'total'
        }]
    }]
    I think I'm doing something wrong but I don't know what
    Thanks

  2. #2
    Sencha User
    Join Date
    May 2012
    Posts
    15
    Vote Rating
    1
    Answers
    1
    Carlos_hb is on a distinguished road

      0  

    Default

    I found that although I'm passing a 12:00 AM data to the store the chart thinks is 12:00 PM, still I don't know why

  3. #3
    Sencha - Support Team
    Join Date
    Mar 2012
    Location
    Lawrence, KS
    Posts
    378
    Vote Rating
    70
    Answers
    54
    greg.barry is just really nice greg.barry is just really nice greg.barry is just really nice greg.barry is just really nice

      0  

    Default

    It looks like you'll need to cast your time/data "types" in your model's field config. They're currently being set to "auto" since you're not defining them.

    You can read more about data types here:
    http://docs.sencha.com/extjs/4.2.2/#...Ext.data.Types
    http://docs.sencha.com/extjs/4.2.2/#...Field-cfg-type

    Thanks!
    Greg

Thread Participants: 1

Tags for this Thread