score:1

Accepted answer

You can use programmatically generated plot-bands. For example:

const plotBands = [];
const series = warData.map((m, index) => {
  if (m.flag === 1) {
    plotBands.push({
      color: 'yellow',
      from: index - 0.5,
      to: index + 0.5
    });
  }

  return {
    name: m.Month,
    data: [
      [m.Month.toString(), JSON.parse(m.Maintenance)]
    ],
  };
});


const options = {
  xAxis: {
    type: "category",
    plotBands
  },
  ...
};

Live demo: http://jsfiddle.net/BlackLabel/95gcsheo/

API Reference: https://api.highcharts.com/highcharts/xAxis.plotBands


Related Articles