ApexCharts 填充线之间的区域

Question

我有一个有多条线的 Apex 图表，我想用特定颜色填充每条线之间的区域。这可能吗？

我搜索了文档，它提到了 "fill" 选项，它似乎只填充了一条线下的所有内容，而且如果我尝试将它添加到我的折线图中，它似乎根本不起作用。

选项：

      const options = {
        chart: {
          type: 'line'
        },
        colors: ["#000000", "#115F66", "#AEC6C8", "#EE7E66", "#115F66", "#AEC6C8"],
        xaxis: {
          type: 'datetime',
          categories: xLabels,
          tickAmount: xLabels.length,
        },
        yaxis: {
          decimalsInFloat: 0,
          min: 0,
        },
        legend: {
          show: false,
        },
        series: [
          {
            name: 'Main',
            data: this.plotting_data.historicalData,
          },
          {
            name: 'First Lower Bound',
            data: this.plotting_data.lowerPred1,
          },
          {
            name: 'Second Lower Bound',
            data: this.plotting_data.lowerPred2,
          },
          {
            name: 'Middle',
            data: this.plotting_data.prediction,
          },
          {
            name: 'First Upper Bound',
            data: this.plotting_data.upperPred1,
          },
          {
            name: 'Second Upper Bound',
            data: this.plotting_data.upperPred2,
          },
        ],
      }

Answer 1

ApexCharts（从 v3.8.5 开始）目前不支持范围面积图。

ApexCharts 填充线之间的区域

ApexCharts filling area between lines

vue.js

apexcharts