Highcharts Gantt Bar Alignment Issue
Shows Issue with alignment of gantt bar charts
by Black Label
HTML
<script src="https://code.highcharts.com/gantt/highcharts-gantt.js"></script>
<div id="container"></div>
CSS
#container {
max-width: 1200px;
height: 500px;
margin: 1em auto;
}
JavaScript
// THE CHART
Highcharts.ganttChart('container', {
"chart":{
// "type":"xrange",
"width":"1200",
"height":"500"
},
"credits":{
"enabled":"true",
"text":"(c) ???"
},
"title":{
"text":""
},
"xAxis":{
"type":"datetime",
"startOnTick":"true",
"endOnTick":"true",
"minPadding":"0",
"maxPadding":"0",
"tickInterval":"3600000",
"minTickInterval":"3600000",
"plotBands":[
{
"color":"rgba(0, 0, 0, 0.0)",
"label":{
"text":279
},
"from":1713765602000,
"to":1713775407000
},
{
"color":"rgba(0, 124, 176, 0.1)",
"label":{
"text":280
},
"from":1713775407000,
"to":1713780248000
},
{
"color":"rgba(0, 0, 0, 0.0)",
"label":{
"text":281
},
"from":1713780248000,
"to":1713784897000
},
{
"color":"rgba(0, 124, 176, 0.1)",
"label":{
"text":282
},
"from":1713784897000,
"to":1713788101000
},
{
"color":"rgba(0, 0, 0, 0.0)",
"label":{
"text":283
},
"from":1713788101000,
"to":1713808800000
}
],
"gridLineWidth":1,
"min":1713765600000,
"max":1713808800000
},
"yAxis":{
"title":"",
"categories":[
"Category 1",
"Category 2",
"Category 3",
"Category 4",
"Category 5",
"Category 6",
"Category 7",
"Category 8",
"Category 9",
"Category 10",
"Category 11"
],
"reversed":"true"
},
"tooltip":{
"enabled":"false"
},
"series":[
{
"name":"Category 1",
...