Echarts柱状图y轴刻度标签图片和柱状渐变功能实现的解决方案

如图所示：前端设计提供的平面，这里面有两个不常用的功能：（1）y轴刻度标签含有图片；（2）柱图线性渐变。需要对echarts的属性十分熟悉才可以实现，具体操作如下:

（1）解决方案： yAxis属性添加：

offset:10,
                axisLabel:{
                    formatter: '{value}  {a|}',
                    rich:{
                        a: {
                            backgroundColor: {
                                image: 'images/arrow.png',
                            },
                            height: 26,
                            width:12
                        },
                    },
                    textStyle:{
                        color:'#038deb',
                        fontWeight:'bold',
                        fontSize:16
                    }
                },

（2）线性渐变: series中添加：

itemStyle:{
                        color:{
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 1,
                            y2: 1,
                            colorStops: [{
                                offset: 0, color: '#90071e' // 0% 处的颜色
                            }, {
                                offset: 1, color: '#f75062' // 100% 处的颜色
                            }],
                            global: false // 缺省为 false
                        },
                    }

Done!