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]
                }
            }
        }]
    };
相关推荐
尾善爱看海6 分钟前
Vue 面试收官篇:SSR、性能优化落地、30 道高频面试题精讲(附标准答案)
前端·javascript·vue.js·面试·vue
weixin_BYSJ198717 分钟前
【计算机毕设】基于SpringBoot与Vue的文物保护档案管理系统08621
vue.js·spring boot·spring cloud·微服务·架构·django·课程设计
Bs_MoneyMagnet39 分钟前
基于springboot+vue的个人健康管理系统的设计与实现 源码+文档
java·vue.js·spring boot·后端·vue3·springboot3·计算机毕业设计
驳是1 小时前
一个组件,提升 react-router 开发的幸福感
前端·preact
GreenTea1 小时前
OpenAI Agents API 上手实测:一次调用把整个 agent loop 甩给 OpenAI
前端·后端·算法
星云API技术支持1 小时前
企业微信二次开发:群权限设置、成员管理与群资料维护的接口组合实践
java·前端·企业微信
京东云开发者1 小时前
81.8 秒的视频,我们改了 15 个版本:一次纯 Codex 驱动的 AI-native 视频实践
前端·aigc
Csvn2 小时前
TypeScript 大型项目架构:从单体 tsconfig 到分层可扩展的工程
前端
Bs_MoneyMagnet3 小时前
基于springboot+vue的心理咨询预约与随访平台的设计与实现 源码+文档
vue.js·spring boot·后端·spring·毕业设计·旅游·计算机毕业设计
计算机魔术师4 小时前
Dario Amodei 发文呼吁为前沿 AI 降速并提出三点计划
前端