echarts柱状图 圆角
时间: 2024-01-12 11:22:30 浏览: 198
echarts柱状图
在echarts中,可以通过配置series的itemStyle属性来设置柱状图的圆角效果。具体的配置方式如下:
1. 设置统一的圆角半径:
```javascript
series: [{
name: '1',
type: 'bar',
itemStyle: {
barBorderRadius: 4 // 设置四个角的圆角半径为4px
},
}]
```
2. 设置不同的圆角半径:
```javascript
series: [{
name: '1',
type: 'bar',
itemStyle: {
barBorderRadius: [2, 3] // 上下为2px,左右为3px
},
}]
```
3. 设置每个角的不同圆角半径:
```javascript
series: [{
name: '1',
type: 'bar',
itemStyle: {
barBorderRadius: [2, 3, 4, 5] // 坐上为2px,右上为3px,左下为4px,右下为5px
},
}]
```
需要注意的是,barBorderRadius的值可以是一个数字或一个数组,数组中的值按照上右下左的顺序表示四个角的圆角半径。
阅读全文