echarts标记区域markArea

var _data = [
    {
        "startTime": "12:30",
        "endTime": "12:45"
    },
    {
        "startTime": "17:00",
        "endTime": "20:45"
    }
]
var markErea = []
// 标记多个区域
_data.forEach(element => {
  markErea.push(
	[{
	  name: '',
	  xAxis: element.startTime,
	  itemStyle: {
		color: "rgba(250,100,190,0.18)",
		borderWidth: 1,
		borderColor: "rgba(250,100,190,0.18)",
	  },
	  label: {
		color: "rgba(194,53,49,1)",
	  }
	},
	{
	  xAxis: element.endTime
	}]
  )
});
// 96个时间区域生成
const startTime = "00:00";
const [startHour, startMinute] = startTime.split(":").map(Number);
const totalPoints = 96;
let timePoints = [];
for (let i = 0; i < totalPoints; i++) {
  const currentHour = startHour + Math.floor(i * 15 / 60);
  const currentMinute = (startMinute + i * 15) % 60;
  const formattedHour = currentHour.toString().padStart(2, "0");
  const formattedMinute = currentMinute.toString().padStart(2, "0");
  // 将格式化后的时间点添加到数组中
  timePoints.push(`${formattedHour}:${formattedMinute}`);
}
console.log(timePoints)
//输出 ["00:00", "00:15", "00:30", "00:45", "01:00", "01:15", "01:30", "01:45", "02:00", "02:15", "02:30", "02:45", "03:00", "03:15", "03:30", "03:45", "04:00", "04:15", "04:30", "04:45", "05:00", "05:15", "05:30", "05:45", "06:00", "06:15", "06:30", "06:45", "07:00", "07:15", "07:30", "07:45", "08:00", "08:15", "08:30", "08:45", "09:00", "09:15", "09:30", "09:45", "10:00", "10:15", "10:30", "10:45", "11:00", "11:15", "11:30", "11:45", "12:00", "12:15", "12:30", "12:45", "13:00", "13:15", "13:30", "13:45", "14:00", "14:15", "14:30", "14:45", "15:00", "15:15", "15:30", "15:45", "16:00", "16:15", "16:30", "16:45", "17:00", "17:15", "17:30", "17:45", "18:00", "18:15", "18:30", "18:45", "19:00", "19:15", "19:30", "19:45", "20:00", "20:15", "20:30", "20:45", "21:00", "21:15", "21:30", "21:45", "22:00", "22:15", "22:30", "22:45", "23:00", "23:15", "23:30", "23:45"]
var option = {
	xAxis: {
	  type: "category",
	  data: timePoints, //横坐标时间
	  boundaryGap: false,
	  type: 'category',
	  boundaryGap: false,
	},
	series:[
	  {
		name: 'XXX',
		type: "line",
		showSymbol: false,
		data: [10,30,40,50,60,34,54,32,88,77],
		itemStyle: {
		  color: "#fff",
		},
        // 标记区域
		markArea: {
		  data: markErea
		}
	  }
	]
}

this.charts.setOption(option, true);
this.charts.resize()