title: Echarts how to highlight area between 2 line charts
body: <p>I want to develop an echart that has the area between 2 linecharts highlighted in a color. To achieve this, I made use of stacked area chart. I set the color of the upper area as the highlight color and color of lower area as white so as to achieve my result. However, the color of bigger area is merging with the lower area and producing a diff color. How can I set the colors of 2 areas to not interfere? Is there a way to give z-index to the areas for this?</p>
  
  <p>Here is my code:</p>
  
  <pre><code>option = {
      title: {
          text: '堆叠区域图'
      },
      tooltip : {
          trigger: 'axis',
          axisPointer: {
              type: 'cross',
          }
      },
      legend: {
          data:['邮件营销','联盟广告','视频广告','直接访问','搜索引擎']
      },
      toolbox: {
          feature: {
              saveAsImage: {}
          }
      },
      grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
      },
      xAxis : [
          {
              type : 'category',
              boundaryGap : false,
              data : ['周一','周二','周三','周四','周五','周六','周日']
          }
      ],
      yAxis : [
          {
              type : 'value'
          }
      ],
      series : [
          {
              name:'联盟广告',
              type:'line',
          smooth: true,
              areaStyle: {color: 'red'},
              data:[170, 182, 161, 184, 160, 180, 165]
          },
          {
              name:'邮件营销',
              type:'line',
          smooth: true,
              areaStyle: {color: 'white'},
              data:[120, 132, 111, 134, 110, 130, 115]
          }
      ]
  };
  </code></pre>
  
  <p>What I have achieved:
  <a href="https://i.stack.imgur.com/esyxT.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/esyxT.png" alt="enter image description here"></a></p>