PDA

View Full Version : [CLOSED] Time axis and stacked column series



sidoron
11 Dec 2012, 11:17 AM
When using stacked column with time axis, if there are a few column with data from the same day the chart column does not align well, also if specify for example step d, 1 and give the time axis 10 days then the chart will excpect exactly 10 columns or it does not look good:

for example, you can see the dates and the result:


Ext.Loader.setConfig({
enabled : true,
disableCaching : true, // For debug only
paths : {
'Chart' : 'Chart'
}
});


Ext.application({
name : 'test stretch',
launch : function() {

var store = Ext.create('Ext.data.JsonStore', {
fields: ['timestamp','columnA','columnB','columnC','columnD'],
data: [
{"timestamp":1354658400000,"columnA":1.4,"columnB":2.0,"columnC":2.0,"columnD":2.0}, //05/12/2012 00:00:00
{"timestamp":1354701600000,"columnA":1.4,"columnB":2.0,"columnC":2.0,"columnD":2.0}, //05/12/2012 12:00:00
{"timestamp":1354708800000,"columnA":1.4,"columnB":2.0,"columnC":2.0,"columnD":2.0}, //05/12/2012 14:00:00
{"timestamp":1354723200000,"columnA":1.4,"columnB":2.0,"columnC":2.0,"columnD":2.0}, //05/12/2012 18:00:00
{"timestamp":1355099000000,"columnA":1.4,"columnB":2.0,"columnC":2.0,"columnD":2.0} //10/12/2012 02:23:20
]
});


Ext.create('Ext.chart.Chart', {
renderTo: Ext.getBody(),
width: 1000,
height: 300,
animate: true,
store: store,

axes: [{
type: 'Numeric',
position: 'left',
fields: ['columnA','columnB','columnC','columnD'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
title: 'Sample Values',
grid: true,
minimum: 0
}, {
type:'Time',
grid:false,
position:'bottom',
fields:['timestamp'],
dateFormat:'d:M h:i',
step:['d',1],
constrain:true,
fromDate:1354658400000, //05/12/2012 00:00:00
toDate: 1355090400000 //10/12/2012 00:00:00


}],
series: [{
type: 'column',
axis:['left', 'bottom'],
stacked:true,
highlight: true,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
var dt = new Date(storeItem.get('timestamp'));
this.setTitle(Ext.Date.format(dt, 'Y-m-d H:i'));
}
},


xField: 'timestamp',
yField: ['columnA','columnB','columnC','columnD']
}]
});

}
});


40718

mitchellsimoens
11 Dec 2012, 12:36 PM
Thanks for the report! I have opened a bug in our bug tracker.