Echarts折线图与柱状图

之前看到一个类似这样的echarts。就简单的实现了一下，不知道是不是最好的实现方式。我是折线图加柱状图来实现的，好像又看到markArea图表区域，不过没看懂。这样大致可以实现

option = {
  xAxis: [
    {
      type: 'category',
      data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
      axisLabel:{
        textStyle:{
            color:function(params) {
              if (params == '周四') {
                return '#CF2929';
              }
            }
        }
      }
    }
  ],
  yAxis: [
    {
      type: 'value',
      name: '',
      // interval: 50
    }
  ],
  series: [
    {
      name: 'bar1',
      type: 'bar',
      data: [
        0,0,0,20.0,0,0,0
      ],
      itemStyle: {
        normal: {
          barBorderRadius:[20,20, 0, 0],
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(207, 40, 42, 0.4)'
          }, {
            offset: 1,
            color: 'rgba(196, 196, 196, 0)'
          }]),
        }
      }
    },
    {
      name: 'line1',
      type: 'line',
      smooth: 0.6,
      symbol: '',
      data: [12.0, 12.2, 13.3, 14.5, 16.3, 20.2, 25.3],
      symbolSize: function(params) {
        if (params == 14.5) {
          return '20';
        } else {
          return '0';
        }
      },
      lineStyle: {
        color: '#CF2929'
      },
      itemStyle: {
        borderWidth: 5,
        borderColor: 'red',
        color: function(params) {
          if (params.value == 14.5) {
            return "#fff";
          }
        }
      }
    },
    {
      name: 'line2',
      type: 'line',
      smooth: 0.6,
      symbol: 'none',
      data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3],
      lineStyle: {
        color: '#F27D51'
      },
    }
  ]
};