多x轴体---

color: ["#FF8D1A"],
  tooltip: {
    trigger: "axis",
    axisPointer: {
      type: "cross",
    },
    textStyle: {
      color: "#fff", // 设置提示框文本颜色为灰色
      fontSize: 16,
    },
    // formatter: '{b} : {c}',
    borderColor: "rgba(0, 0, 0, 0)",
    backgroundColor: "rgba(0, 0, 0, 0.5)", // 设置提示框背景颜色为灰色，透明度为0.7
    formatter: function (parmas) {
      let html = `<p style='font-size:14px'>${parmas[0].name}<p/>`;
      let result = parmas.reduce((acc, currentValue) => {
        let foundArray = acc.find((item) => item[0].seriesName === currentValue.seriesName);
        if (foundArray) {
          foundArray.push(currentValue);
        } else {
          acc.push([currentValue]);
        }
        return acc;
      }, []);
      result.forEach((element) => {
        if (element == void 0) return;
        html += `<p style='font-size:14px'>
        <span style="display:inline-block; width: 100px">${element[0].seriesName} </span>
        <span style="display:inline-block; width: 10px; height: 10px; background-color: #FF8D1A;border-radius:50%"></span>
         实际生产值 ${element[0].value},
         <span style="display:inline-block; width: 10px; height: 10px; background-color: #00BAAD;border-radius:50%"></span>
        目标配备:  ${element[1].value}</p>`;
      });
      return html;
    },
  },
  legend: {
    show: false,
  },
  axisPointer: {
    link: { xAxisIndex: "all" },
    label: {
      backgroundColor: "transparent",
      formatter: function (res) {
        console.log("res", res);
        if (res.axisDimension == "x") {
          return "";
        } else {
          console.log(res);
          return "";
        }
      },
    },
    lineStyle: {
      color: "#b6d88e", // 设置整体背景色
    },
  },
  dataZoom: [{ type: "inside", xAxisIndex: [0, 1, 2], zoomLock: true }],
  grid: [
    {
      left: "7%",
      top: "7%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "17%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "27%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "37%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "47%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "57%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "67%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "77%",
      width: "90%",
      height: "8%",
      containLabel: "true",
    },
    {
      left: "7%",
      top: "87%",
      width: "90%",
      height: "13%",
      containLabel: "true",
    },
  ],

  xAxis: [
    {
      gridIndex: 0,
      axisLabel: { show: false },
      data: timeList,
      name: "1#",
      nameLocation: "start",
    },
    {
      gridIndex: 1,
      data: timeList,
      axisLabel: { show: false },
      name: "2#",
      nameLocation: "start",
    },
    {
      gridIndex: 2,
      data: timeList,
      axisLabel: { show: false },
      name: "3#",
      nameLocation: "start",
    },
    {
      gridIndex: 3,
      data: timeList,
      axisLabel: { show: false },
      name: "4#",
      nameLocation: "start",
    },
    {
      gridIndex: 4,
      data: timeList,
      axisLabel: { show: false },
      name: "5#",
      nameLocation: "start",
    },
    {
      gridIndex: 5,
      data: timeList,
      axisLabel: { show: false },
      name: "6#",
      nameLocation: "start",
    },
    {
      gridIndex: 6,
      data: timeList,
      axisLabel: { show: false },
      name: "水泥剂量",
      nameLocation: "start",
    },
    {
      gridIndex: 7,
      data: timeList,
      axisLabel: { show: false },
      name: "水含量",
      nameLocation: "start",
    },
    {
      gridIndex: 8,
      data: timeList,
      axisLabel: {},
      name: "添加剂",
      nameLocation: "start",
    },
  ],
  yAxis: [
    { gridIndex: 0, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 1, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 2, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 3, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 4, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 5, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 6, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 7, min: 0, max: 10, show: false, splitNumber: 10 },
    { gridIndex: 8, min: 0, max: 10, show: false, splitNumber: 10 },
  ],
  series: [
    {
      name: "1#",
      type: "bar",
      data: [1, 2, 3, 4, 15],
      barWidth: 30,
      z: 2, // 设置层叠顺序，数值越大，显示在越上层
    },

    {
      name: "2#",
      type: "bar",
      xAxisIndex: 1,
      yAxisIndex: 1,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "3#",
      type: "bar",
      xAxisIndex: 2,
      yAxisIndex: 2,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "4#",
      type: "bar",
      xAxisIndex: 3,
      yAxisIndex: 3,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "5#",
      type: "bar",
      xAxisIndex: 4,
      yAxisIndex: 4,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "6#",
      type: "bar",
      xAxisIndex: 5,
      yAxisIndex: 5,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "水泥剂量",
      type: "bar",
      xAxisIndex: 6,
      yAxisIndex: 6,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "水含量",
      type: "bar",
      xAxisIndex: 7,
      yAxisIndex: 7,
      data: [1, 2, 3, 4, 5],
      barWidth: 30,
    },
    {
      name: "添加剂",
      type: "bar",
      xAxisIndex: 8,
      yAxisIndex: 8,
      data: [110, 8, 3, 4, 5],
      barWidth: 30,
    },

    {
      name: "1#",
      type: "bar",
      xAxisIndex: 0,
      yAxisIndex: 0,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "2#",
      type: "bar",
      xAxisIndex: 1,
      yAxisIndex: 1,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "3#",
      type: "bar",
      xAxisIndex: 2,
      yAxisIndex: 2,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "4#",
      type: "bar",
      xAxisIndex: 3,
      yAxisIndex: 3,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "5#",
      type: "bar",
      xAxisIndex: 4,
      yAxisIndex: 4,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "6#",
      type: "bar",
      xAxisIndex: 5,
      yAxisIndex: 5,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },

    {
      name: "水泥剂量",
      type: "bar",
      xAxisIndex: 6,
      yAxisIndex: 6,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },
    {
      name: "水含量",
      type: "bar",
      xAxisIndex: 7,
      yAxisIndex: 7,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },
    {
      name: "添加剂",
      type: "bar",
      xAxisIndex: 8,
      yAxisIndex: 8,
      data: [5, 5, 5, 5, 15],
      barWidth: 40,
      z: 1, // 设置层叠顺序，数值越大，显示在越上层
      itemStyle: {
        color: "#00BAAD", // 指定颜色
      },
      barGap: "-117%", // 设置负值，使第一个系列的柱状图重叠显示在第二个系列上
      barCategoryGap: "50%", // 控制两个系列之间的间隔
    },
  ],