echarts——设置toolTip大小和样式问题

最新推荐文章于 2024-11-08 16:41:25 发布

Underwood688

最新推荐文章于 2024-11-08 16:41:25 发布

阅读量6.9k

点赞数

分类专栏： web echarts 文章标签： echarts

本文链接：https://blog.youkuaiyun.com/ningma30000/article/details/103424059

版权

web 同时被 2 个专栏收录

15 篇文章

订阅专栏

echarts

1 篇文章

订阅专栏

本文介绍如何在ECharts中解决提示框过大及位置不合适的问题，通过设置位置和添加额外样式，实现对提示框的精确控制，确保其始终显示在屏幕内。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

echarts中，提示框过大，位置不合适，跑到屏幕外了。

可以通过设置位置，添加额外样式来控制。

官网文档http://echarts.baidu.com/option.html#tooltip.extraCssText

tooltip: {
    trigger: 'item',
    position: function(p) { //其中p为当前鼠标的位置
        return [p[0] + 10, p[1]];
    },
    extraCssText: 'width:160px;height:50px;',
    formatter: "{a} <br/>{b} : {c} ({d}%)", 
    //{a}（系列名称），{b}（数据项名称），{c}（数值）, {d}（百分比）
},