I am creating a gantt chart using Highcharts for a process that has three phase Request, Submission and Approval. It has two stacks for Planned and Actual.
I used the highcharts stacked bars to represent the data plotted like this jsFiddle of Gantt
Instead of data as
series: [{
name: 'Requested',
data: [1,3,4,5,6],
stack: 'Planned'
}, {
name: 'Requested',
data: [2,4,5,7,8],
stack: 'Actual'
}, {
name: 'Submitted',
data: [2,3,2,3,4],
stack: 'Planned'
}, {
name: 'Submitted',
data: [3,5,2,3,4],
stack: 'Actual'
}, {
name: 'Approved',
data: [6,3,2,3,4],
stack: 'Planned'
}, {
name: 'Approved',
data: [2,4,2,3,4],
stack: 'Actual'
}]
I want the data as dates here I have the first,second and third dates respectively for Requested,Submission and Approval.
series: [{
name: 'Part1',
data: [Date.UTC(2013,01,12),Date.UTC(2013,01,23),Date.UTC(2013,02,05)],
stack: 'Planned'
}, {
name: 'Part1',
data: [Date.UTC(2013,01,15),Date.UTC(2013,01,29),Date.UTC(2013,02,05)],
stack: 'Actual'
},]
I need the series name on y-axis to be taken from the data in series
xAxis: {
categories: ['Part1', 'Part2', 'Part3', 'Part4', 'Part5']
},
and 1. the start should be from the data[0] instead hence it will contain two bars and three points. 2. I need difference of dates in the bar so hence I can show the time for each activity.
I tried a with time in millisecondsjsfiddle but couldn't come to anything substantial