Setting a chart time axis to have a grid can cause errors with certain step/start val

**mAritz** · 8 Dec 2011 7:57 AM

REQUIRED INFORMATION

Ext version tested:

Ext 4.0.7
Ext 4.1-pr1

Description:

Setting a chart time axis to have a grid can cause errors with certain step/start values.

Steps to reproduce the problem:

4.0.7: src/draw/Draw.js Line 1080:

Code:

case Ext.Date.DAY:testFrom = new Date(fromStat[0], fromStat[1],
Math.floor(fromStat[2] - 1 / step[1]) * step[1] + 1, 0, 0, 0, 0);
break;

Input:

Code:

var fromStat = [2011, 10, 23, 0, 0, 0, 0]; // Wed Nov 23 2011 01:00:00 GMT+0100 (CET)
var step = [Ext.Date.DAY, 10]; // put grid marker/line every 10 days

Problematic part:

Code:

Math.floor(fromStat[2] - 1 / step[1]) * step[1]+1; // 23 - 1 / 10 = 22.9 -> floor = 22 -> 22 * 10 + 1 = 221

Possible fix:

Code:

Math.floor((fromStat[2] - 1) / step[1]) * step[1]+1; // (23 - 1) / 10 = 2.2 -> floor = 2 -> 2 * 10 +1 = 21

But i'm not sure what exactly this is supposed to accomplish. I just know that a value like 221 does NOT work.

Btw: Steps in the same function is used multiple times for division. If steps === 0, you get 123/0 === Infinity, causing other systems that don't handle this case to fail. Ultimately ending in error messages like "undefined has no method 'substring'".

**mitchellsimoens** · 13 Dec 2011 11:36 AM

Can I get a fully runnable test case?

**mAritz** · 13 Dec 2011 2:49 PM

I'm rather new to Ext.js and haven't looked at the way you do tests, so I can't promise anything. But I'll try to get it in my schedule sometime next week.

Edit: But I do see that I made an error in my comments in the code examples. I'll fix it tomorrow.

**mAritz** · 14 Dec 2011 3:03 AM

Guess I misunderstood your request.

I changed the example in Ext.chart.axis.Numeric to reproduce the error. (and removed some parts to make it easier to read)

Code:

var store = Ext.create('Ext.data.JsonStore', {
  fields: ['date', 'data1', 'data2', 'data3', 'data4', 'data5'],
  data: [
    {'date':new Date('2011-10-21'), 'data1':10},
    {'date':new Date('2011-12-01'), 'data1':1}
    // more data would go here, removed to conserve space
  ]
});


Ext.create('Ext.chart.Chart', {
  renderTo: Ext.getBody(),
  width: 1000,
  height: 800,
  store: store,
  axes: [{
    type: 'Numeric',
    position: 'left',
    fields: ['data1'],
    title: 'Sample Values',
    minimum: 0
  }, {
    type: 'Time',
    position: 'bottom',
    fields: ['date'],
    dateFormat: 'Y-m-d',
    grid: true,
    step: [Ext.Date.DAY, 15],
    fromDate: new Date('2011-10-20'),
    toDate: new Date('2012-01-31')
  }],
  series: [{
    type: 'line',
    highlight: false,
    axis: ['bottom', 'left'],
    xField: ['date'],
    yField: ['data1'],
    style: {
      opacity: 0.93
    }
  }]
});

This will result in no grid and only 2 labels on the time axis, one of which is 0NaN-NaN-NaN. This is still mild however, I've had cases where the chart didn't draw at all with other fromDate/toDate/step values.

**mitchellsimoens** · 14 Dec 2011 6:08 AM

Yeah, to be honest I've had problems with the time axis. Thanks for the test case!

**mAritz** · 25 Jan 2012 4:20 AM

Any news on this?

**mAritz** · 5 Mar 2012 3:00 AM

Ping

**mitchellsimoens** · 5 Mar 2012 5:23 AM

Originally Posted by mAritz

Ping

Yes? This is still marked as [OPEN]

**mAritz** · 5 Mar 2012 5:27 AM

Oh, my mistake, I'm sorry. I never scrolled back up that far to see either the "[Open]" or the "You found a bug! We've classified it as EXTJSIV-4757".

Thus I wasn't sure this was actually accepted as a bug.

Setting a chart time axis to have a grid can cause errors with certain step/start val

Thread Tools

Search Thread

Display

Setting a chart time axis to have a grid can cause errors with certain step/start val

Setting a chart time axis to have a grid can cause errors with certain step/start val