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]
                }
            }
        }]
    };
相关推荐
Mr Xu_几秒前
Vue 3 中 watch 的使用详解:监听响应式数据变化的利器
前端·javascript·vue.js
未来龙皇小蓝3 分钟前
RBAC前端架构-01:项目初始化
前端·架构
程序员agions12 分钟前
2026年,微前端终于“死“了
前端·状态模式
万岳科技系统开发12 分钟前
食堂采购系统源码库存扣减算法与并发控制实现详解
java·前端·数据库·算法
程序员猫哥_20 分钟前
HTML 生成网页工具推荐:从手写代码到 AI 自动生成网页的进化路径
前端·人工智能·html
龙飞0520 分钟前
Systemd -systemctl - journalctl 速查表:服务管理 + 日志排障
linux·运维·前端·chrome·systemctl·journalctl
我爱加班、、25 分钟前
Websocket能携带token过去后端吗
前端·后端·websocket
AAA阿giao25 分钟前
从零拆解一个 React + TypeScript 的 TodoList:模块化、数据流与工程实践
前端·react.js·ui·typescript·前端框架
杨超越luckly32 分钟前
HTML应用指南:利用GET请求获取中国500强企业名单,揭秘企业增长、分化与转型的新常态
前端·数据库·html·可视化·中国500强
一 乐1 小时前
校园二手交易|基于springboot + vue校园二手交易系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端