Echarts 更换柱状图样式 渐变色+圆角

Echarts 更换柱状图样式 渐变色+圆角

这个是实现之后的效果（自古粉蓝出CP）

需要在 series 中进行定义，下面是整个 series 代码

series: [{
          name: '节点数量',
          type: 'bar',
          data: series,
          barWidth: 40, // 柱图宽度
          itemStyle: {
            emphasis: {
              barBorderRadius: [7, 7, 0, 0]
            },
            normal: {
              barBorderRadius: [7, 7, 0, 0],
              color: function(params) {
                return new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                  offset: 0,
                  color: '#70aede' // 0% 处的颜色
                },
                  {
                    offset: 1,
                    color: '#f1b7d4' // 100% 处的颜色
                  }
                ], false)
              }
            }
          },
          label: {
            normal: {
              show: true,
              position: 'top'
            }
          }
        }]

实现圆角的代码如下：其中 [7, 7, 0, 0] 代表的分别是左上、右上、右下、左下的圆角

emphasis: {
              barBorderRadius: [7, 7, 0, 0]
            },
            normal: {
              barBorderRadius: [7, 7, 0, 0]
			}

实现渐变的代码如下：

color: function(params) {
                return new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                  offset: 0,
                  color: '#70aede' // 0% 处的颜色
                },
                  {
                    offset: 1,
                    color: '#f1b7d4' // 100% 处的颜色
                  }
                ], false)
              }