To generate a chart with stacked columns and two lines, specify the appropriate number of series and enable stacking for column ones. Here's an example:
Highcharts.chart('container', {
plotOptions: {
column: {
stacking: 'normal'
}
},
series: [{
type: 'line',
data: [...]
}, {
type: 'line',
data: [...]
}, {
type: 'column',
data: [...]
}, {
type: 'column',
data: [...]
}, ...]
});
See it in action: http://jsfiddle.net/BlackLabel/jL0sq2vo/
Learn more: https://www.highcharts.com/docs/chart-concepts/series
If you're unsure about how the line series are linked to the column ones in your situation, you can utilize the show
/ hide
series events to make adjustments to the line series data. For instance:
plotOptions: {
column: {
stacking: 'normal',
events: {
show: function() {
const series = this.chart.series;
baseLine1 = baseLine1.map(el => el + 1);
baseLine2 = baseLine2.map(el => el + 1);
series[0].setData(baseLine1, false);
series[1].setData(baseLine2);
},
...
}
}
}
See live demo: http://jsfiddle.net/BlackLabel/rg4mdaov/
Check out the API Reference: https://api.highcharts.com/class-reference/Highcharts.Series#setData