您的位置首页百科知识

Echarts 柱状图设置圆柱的样式为圆角

Echarts 柱状图设置圆柱的样式为圆角

的有关信息介绍如下:

Echarts 柱状图设置圆柱的样式为圆角

在项目中,有时候需要给echarts柱状图设置圆角样式,这样看起来更美观,效果图如下

实现柱状图圆角样式只需要在series标签下设置barBorderRadius属性

itemStyle:{

normal:{

//柱形图圆角设置

barBorderRadius:[20,20,0,0]//柱形图圆角设置

}

},

效果图如下:

默认单位为px,四个值代表(顺时针左上,右上,右下,左下)

如果只是一个数字则说明四个参数全部设置为一样,写法如下:

barBorderRadius:20

效果图如下:

可以参考echarts官方文档:

https://echarts.apache.org/zh/option.html#series-bar.itemStyle.barBorderRadius