PDA

View Full Version : Cartesian chart axsis not showing correctly



jask87
12 Feb 2015, 12:49 PM
I am setting up this dynamic chart but the begin and end does not look as expected. The end result needs to be that it only shows one day for each point and the points correlate with the lines.



me.items = [{ xtype: 'cartesian',
width: '100%',
height: 500,
store: store,
insetPadding: 40,
innerPadding: {
left: 40,
right: 40
},
axes: [{
type: 'numeric',
fields: 'data1',
position: 'left',
grid: true,
minimum: 0,
renderer: function (v, layoutContext) {
return '$' + layoutContext.renderer(v);
}
}, {
type: 'time',
fields: 'day',
position: 'bottom',
dateFormat: 'M d',
//grid: true,
fromDate: new Date(2015, 2, 1, 0, 0, 0, 0),
toDate: new Date(2015, 2, 31, 0, 0, 0, 0),
label: {
rotate: {
degrees: -90
}
}
}],
series: [{
type: 'line',
xField: 'day',
yField: 'data1',
style: {
lineWidth: 4
},
marker: {
radius: 4
},
label: {
field: 'data1',
display: 'over'
},
highlight: {
fillStyle: '#000',
radius: 5,
lineWidth: 2,
strokeStyle: '#fff'
},
tooltip: {
trackMouse: true,
style: 'background: #fff',
showDelay: 0,
dismissDelay: 0,
hideDelay: 0,
renderer: function(storeItem, item) {
this.setHtml(Ext.Date.format(storeItem.get('day'), "m/d/Y") + ': $' + storeItem.get('data1'));
}
}
}]
}];

Gary Schlosberg
12 Feb 2015, 3:19 PM
A bit hard to tell from the image. Are you able to recreate this in a Fiddle?
https://fiddle.sencha.com/#home

jask87
13 Feb 2015, 9:12 AM
https://fiddle.sencha.com/fiddle/i8a

I was able to recreate the problem. The showing of the dates twice is obviously dependent on the size of the chart. If you expand the window far enough (i have a pretty wide screen, so i dont have to) it renders the dates twice. Is there a way to stop that from happening?

The other problem is that the begin and end it showing weird. It renders this extra line and write Mar 01 twice. And Mar 30 also renders this extra line. Why is this happening?

jask87
16 Feb 2015, 10:04 AM
Does anyone know why this is happening and/or how to controle this?