Hi Community. I am working with gantt charts, which is really similar to a bar chart. I would like to know if there are a way of configure my code to have a multilevel axis. I have 2 projects with different phases. So I would like to be able to see the name of the project in a first level and as second level the name of the phases that are going to match with my data. As example how you can see in my graph, I have company A and B and each company can have 5 phases that are described in the legend. instead of show that in the legend I would be able to show that in my Y axis so I can see the name of the project and the phase that correspond to a bar in the graph.
Is there a way of arrange my data to have the chart display in that way?
here is my code:
{
type: 'horizontalBar',
data: {
labels: ['Ma Aviation Hangar','Ottawa Office Expansion'],
datasets: [{
label:'Assesment',
data: [
[new Date('2023-09-07'), new Date('2023-09-15')],
[new Date('2023-08-14'), new Date('2023-10-19')],
],
backgroundColor: '#5778a4',
},{
label:'Design',
data: [
[new Date('2023-09-18'), new Date('2023-10-02')],
[new Date('2023-10-23'), new Date('2023-11-27')],
],
backgroundColor: '#6a9f58',
},
{
label:'Bid',
data: [
[],
[new Date('2023-11-28'), new Date('2023-12-13')],
],
backgroundColor:'#967662',
},
{
label:'PM',
data: [
[new Date('2023-10-03'), new Date('2024-01-05')],
[new Date('2023-12-14'), new Date('2024-04-26')],
],
backgroundColor: '#b8b0ac',
},{
label:'Closeout',
data: [
[new Date('2024-01-8'), new Date('2024-01-22')],
[new Date('2024-04-29'), new Date('2024-05-10')],
],
backgroundColor: '#e49444',
}],
},
options: {
legend: {
display: true,
position: 'bottom',
},
annotation: {
annotations: [{
type: 'line',
mode: 'vertical',
scaleID: 'x-axis-0',
value: new Date('2021-10-30'),
borderColor: 'red',
borderWidth: 1,
label: {
enabled: true,
content: 'Deadline',
position: 'top'
}
}]
},
scales: {
xAxes: [{
position: 'top',
type: 'time',
time: {
unit: 'month'
},
ticks: {
min: new Date('2023-08-01'),
max: new Date('2024-08-01'),
}
}],
},
},
}
