echarts 折线区域图基本样式修改

echarts 折线区域图基本样式参数

    const option = {
      title: {
        text: ''
      },
      grid: {
        left: '5%',
        top: '5%',
        right: '0%',
        bottom: '10%'
      },
      // 鼠标移动到数据上时坐标轴的提示
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          label: {
            backgroundColor: '#6a7985'
          }
        }
      },
      legend: {
        left: 'left',
        icon: 'roundRect' // 这个字段控制形状 类型包括 circle，rect
      },
      xAxis: [{
        type: 'category',
        // 坐标刻度
        axisTick: {
          show: true
        },
        // 坐标轴横线颜色
        axisLine:{
            lineStyle:{
               color:'rgba(56, 191, 96, 0.2)'
            } 
        },
        axisLabel: {
            color: '#666666',
        },
        boundaryGap: false,
        data: this.time
      }],
      yAxis: [{
        type: 'value',
        axisTick: {
          show: false
          // 删除超出正坐标线段
        },
        // 坐标轴横线颜色
        axisLine:{
           show: false
        },
        min: 0,
        max: 100,
        axisLabel: {
          color: '#666666', //y坐标轴的字体颜色
          formatter: '{value}'
        },
        splitLine: { // 坐标轴以外的横线颜色
          show: false
        }
      }],

      series: [{
          name: '',
          type: 'line',
          stack: '总量',
          // 去掉折线线条的点
          symbol: "none",
          smooth: true, // 是否平滑曲线显示
          areaStyle: {
            normal: {
                //颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ 
                offset: 0,
                color: 'rgba(56, 191, 96, 0.08)',
            }, 
            {
                offset: 1,
                color: 'rgba(56, 191, 96, 0.08)',//#21202E
            }])
            }
          }, 
          itemStyle: {
            normal: {
              // 修改数据边界的线颜色
              lineStyle: {
                color: 'rgba(56, 191, 96, 0.5)' //改变折线颜色
              }
            }
          },
          data: this.num
        }
      ]
    }