Lines Marker, требующий центра в барах.
Рабочий фрагмент прилагается для справки
Highcharts.chart('container', {
chart: {
zoomType: 'false',
height: '274px'
},
title: {
text: ''
},
colors: ['#f47a42', '#f4418c', '#028fcf', '#000000', '#f39200'],
subtitle: {
text: ''
},
xAxis: {
categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
crosshair: true,
min: 0,
},
yAxis: {
min: 0,
title: {
text: ''
}
},
tooltip: {},
plotOptions: {
column: {
pointPadding: 0,
borderWidth: 0
}
},
series: [{
type: 'column',
name: 'XYZ',
data: [346, 336, 436, 504, 740, 902, 735, 815, 866, 763, 742, 496],
events: {
legendItemClick: function (event) {
this.visible ?
this.chart.get('XYZ').hide() :
this.chart.get('XYZ').show();
}
}
}, {
showInLegend: false,
type: 'line',
name: 'XYZ',
id: 'XYZ',
data: [346, 336, 436, 504, 740, 902, 735, 815, 866, 763, 742, 496]
}, {
type: 'column',
name: ' ABC',
data: [250, 311, 457, 571, 701, 716, 760, 815, 876],
events: {
legendItemClick: function (event) {
this.visible ?
this.chart.get('ABC').hide() :
this.chart.get('ABC').show();
}
}
}, {
showInLegend: false,
type: 'line',
name: 'ABC',
id: 'ABC',
data: [250, 311, 457, 571, 701, 716, 760, 815, 876]
}
],
credits: {
enabled: false
},
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<div id="container"></div>