echarts柱状图实现每根柱子不同颜色渐变

改变颜色在echarts配置项series里的itemStyle.color设置
这里只放了series里的代码

series: [
          {
            name: '',
            type: 'bar',
            barWidth:30,        // 柱状图间隔
            itemStyle: {
              barBorderRadius:[5,5,0,0],       // 柱状图头部圆弧
              // 柱状图颜色
              color: params => {
              //  colorList是每根柱子的颜色，一组是一个渐变
                var colorList = [
                  ['#62C467','#278D65'],
                  ['#FF5B7A','#BC3535'],
                  ['#FFF600','#D69105'],
                  ['#FFB400','#F66800'],
                  ['#00CCFF','#2A54B4'],
                  ['#F75271','#754ABF']
                ]
                var index = params.dataIndex
                // 柱子个数超过colorList设置的个数，循环使用
                if (index >= colorList.length) {
                  index =index - colorList.length
                }
                // 这里的this.$echarts是项目中的echarts示例，改成对应的名字就好
                return new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                  offset: 0,
                  color: colorList[index][0]
                }, {
                  offset: 1,
                  color: colorList[index][1]
                }])
              }
            },
            data: []
          }
        ]

这是效果图