渐变色柱状图

使用echarts实现渐变色柱状图

import * as echarts from 'echarts';

   <ta-col :span="6">
        <div id="patientAccessTopChart" :style="{width:'100%',height:`${height}px`}"></div>
      </ta-col>

 //患者被访问总次数排行前10
    patientAccessTopChart(patientTopData, patientTopCategory) {
      let myChart = echarts.init(document.getElementById("patientAccessTopChart"));
      let str = ''
      let option = {
        title: {
          text: '患者被访问总次数排行前10',
          textStyle: {
            fontSize: 14,
            color: '#AAAAAA'
          }
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        legend: {},
        grid: {
          left: '2%',
          right: '5%',
          bottom: '2%',
          containLabel: true
        },
        xAxis: {
          type: 'value',
          boundaryGap: [0, 0.01]
        },
        yAxis: {
          type: 'category',
          data: patientTopCategory,
          inverse: true,//柱状图倒序排序,
          nameTextStyle: {
            fontSize: 9,
          }
        },
        series: [
          {
            name: '',
            type: 'bar',
            data: patientTopData,
            label: {
              color: '#fff',
              show: true
            },
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(
                    0, 0, 0, 1,
                    [
                      {offset: 0, color: '#367EEF'},
                      {offset: 1, color: '#FF6326'}
                    ]
                )
              }
            },
          }
        ]
      };
      myChart.clear();
      myChart.setOption(option);
    },