echarts环形图 legend文字过长

最新推荐文章于 2023-10-27 15:01:16 发布

StriplingLee

最新推荐文章于 2023-10-27 15:01:16 发布

阅读量1.2k

点赞数

文章标签： vue.js echarts

本文链接：https://blog.csdn.net/StriplingLee/article/details/117422772

版权

博客探讨了在图形化工具中遇到的问题，即当图例名称过长时会遮挡百分比和数值。通过在legend配置项中设置formatter函数，截断过长的图例名称，以防止后续文字被遮挡。虽然此方法能避免文字覆盖，但过长的内容会被替换为省略号。

摘要由CSDN通过智能技术生成

当文字太过于长时，会直接将后方的百分比和相关数值给遮挡。这时就需要在legend:{}里面进行相关的操作

 legend: {
                    // 图例显示数据
                    formatter: function(params) {
                            if (!v.name) return '';
                            if (v.name.length > 7) {
                                v.name = v.name.slice(0, 7) + '...';
                            }
                        });
                    },
                    tooltip: {
                        show: true
                    },
                    }