Extjs 4: Time Stacked Bar Chart, possible?

Question

Hi I'm trying to accomplish a time stacked bar chart where the input data looks like this:

{"name":"Folienwechsel",
 "starttime":"02/29/2012 09:50:07",
 "endtime":"02/29/2012 09:50:46",
 "duration":38546.0},
{"name":"Pause",
 "starttime":"02/29/2012 09:50:46",
 "endtime":"02/29/2012 09:51:36",
 "duration":49943.0},
{"name":"Wartezeiten",
 "starttime":"02/29/2012 09:51:36",
 "endtime":"02/29/2012 10:04:43",
 "duration":787086.0}

As you see the start time and end time are continued, when a state finish the other one starts, I've been trying with the timeaxis, based on this tutorial http://aboutfrontend.com/extjs/extjs...-and-timeaxis/, and also with the stackbar example in sencha http://docs.sencha.com/ext-js/4-0/#!...tackedBar.html. An image example of what I'm trying to do:

timeline

I already done this with HighChart, but my company has bought ExtJs then I need to do this with Extjs, then it would be great if someone can tell me if its possible, and if it is, then if could guide me with an example or how should I start...

Thanks.

Could you please let me know how to do that in Highcharts? I've post my question here. Thanks a lot. — sozhen
Or could you please tell me what kind of chart type you were using for plotting that and what's the input data format. Thank you! — sozhen

Andrey Selitsky Andrey Selitsky · Accepted Answer · 2012-03-01T08:15:12

I spent some time working with time based charts in ExtJs4 and I have to warn you - that TimeAxis is buggy. I even had to replace my time axes with simple numeric ones. The idea is simple - convert your dates into the timestamps and pass them to your numeric axis.

Stackbar chart is a good choice for you. See this example (modified a bit), from official sencha examples:

http://jsfiddle.net/UDwz7/

Extjs 4: Time Stacked Bar Chart, possible?

1 Answers