echarts 实现柱状图bar顶部圆角显示

效果展示:

关键代码

javascript 复制代码
            itemStyle: {
                normal: {
                    barBorderRadius:[5, 5 , 0, 0]
                }
            }

完整代码

javascript 复制代码
option = {
        title: {
            text: '',
            textStyle: {
                color: '#000',
                fontSize: 14
            }
        },
        tooltip: {},
        grid: {
            left: '0',
            right: '0',
            bottom: '0',
            containLabel: true
        },
        xAxis: {
            data: ['赵','钱','孙','李'],
            axisLine: {
                lineStyle: {
                    color: '#cccccc'
                }
            },
        },
        yAxis: {
            axisLine: {
                lineStyle: {
                    color: '#cccccc'
                }
            },
        },
        series: [{
            type: 'bar',
            data: [10,30,50,29],
            barMaxWidth: 25,
            itemStyle: {
                normal: {
                    barBorderRadius:[5, 5 , 0, 0]
                }
            }
        }]
    };
相关推荐
一只叫煤球的猫4 分钟前
普通程序员,从开发到管理岗,为什么我越升职越痛苦?
前端·后端·全栈
vvilkim11 分钟前
Electron 自动更新机制详解:实现无缝应用升级
前端·javascript·electron
vvilkim14 分钟前
Electron 应用中的内容安全策略 (CSP) 全面指南
前端·javascript·electron
aha-凯心25 分钟前
vben 之 axios 封装
前端·javascript·学习
漫谈网络29 分钟前
WebSocket 在前后端的完整使用流程
javascript·python·websocket
遗憾随她而去.40 分钟前
uniapp 中使用路由导航守卫,进行登录鉴权
前端·uni-app
xjt_09011 小时前
浅析Web存储系统
前端
foxhuli2292 小时前
禁止ifrmare标签上的文件,实现自动下载功能,并且隐藏工具栏
前端
青皮桔2 小时前
CSS实现百分比水柱图
前端·css
失落的多巴胺2 小时前
使用deepseek制作“喝什么奶茶”随机抽签小网页
javascript·css·css3·html5