echarts--提示框显示不全问题记录
创始人
2024-05-29 13:08:07
0次
最近接手一个同事之前做的网页，发现里面使用echarts来绘制各类图表；有2个问题一个是提示框显示不全，另一个就是绘制总是有部分数据显示不全。后者就是div宽度问题。。。无语，说下前面一个问题吧，记录一下。
tooltip组件介绍
一般都是直接用echarts的tooltip组件：
tooltip: {
show: true,//是否显示提示框
showContent: true,
enterable: true,//鼠标是否可进入提示框浮层中，默认为false，如需详情内交互，如添加链接，按钮，可设置为 true。
trigger: ‘item’,//可选，饼图、散点图用item，柱状图、折线图用axis，none什么都不触发
confine: true,//是否将 tooltip 框限制在图表的区域内。当图表外层的 dom 被设置为 ‘overflow: hidden’，或者移动端窄屏，导致 tooltip 超出外界被截断时，此配置比较有用。
formatter: ‘{a}
{b}:{c} {d}%’,//提示框浮层内容格式器，支持字符串模板和回调函数两种形式。
textStyle: {//提示框内文字样式的设置
color:‘red’, //颜色
fontSize:‘18’ //字体大小
}
},
问题现象
大概如上图，提示框在边缘只显示了一半。
解决方案
开始想着去算什么位置之类的，后来看文档发现，其实挺简单的
设置tooltip的confine属性即可，官网的介绍：confine:是否将 tooltip 框限制在图表的区域内。
增加后大概这样
这下边缘的数据点的提示框显示就始终在canvas内了：
相关内容
热门资讯
QQ群晚会开幕词
QQ群晚会开幕词 QQ群晚会开幕词 尊贵的各位嘉宾，群主，各位管理，群友们大家晚上好： ...
主持谢幕词
主持谢幕词范本 篇一：主持谢幕词 愿一切荣耀、尊贵、颂赞都归给至高上帝！ 都说“台上一分钟，台...
圣诞节联欢晚会主持词
圣诞节联欢晚会主持词 主持词的写作需要将主题贯穿于所有节目之中。在一步步向前发展的社会中，主持词与...
元宵节的主持词
元宵节的主持词 一般在节日的时候，都是会举行一些活动的，尤其是在元宵节这个大型的节日。下面是小编为...
初中生晨会主持词
初中生晨会主持词（通用5篇） 主持词要尽量增加文化内涵、寓教于乐，不断提高观众的文化知识和素养。现...
晨会主持词开场白
开晨会是公司职场管理的规章制度，那么公司晨会主持如何开场白好呢？以下是小编为大家搜集整理提供到的...
企业年会主持词
企业年会主持词 主持词是主持人在台上表演的灵魂之所在。在人们越来越多的参与各种活动的今天，主持词是...
企业晚会的主持词
企业晚会的主持词 借鉴诗词和散文诗是主持词的一种写作手法。在人们越来越多的参与各种活动的今天，主持...
年终总结会主持词
2021年终总结会主持词范文（精选13篇） 契合现场环境的主持词能给集会带来双倍的效果。现今社会在...
半台词爆笑
三句半台词大全爆笑 三句半是一种中国民间群众传统曲艺表演形式，下面是为带大家整理的爆笑的'三句半台...
三八妇女节活动主持词
三八妇女节活动主持词3篇 三月的春风拂过我们脚下的土地，三月的惊雷敲响了我们奋进的汽笛，三月我们迎...
文艺晚会主持人主持词
文艺晚会主持人主持词（精选10篇） 主持词是各种演出活动和集会中主持人串联节目的串联词。在当下这个...
校园文艺晚会结束语
下面文艺晚会结束语是小编为你们寻找的，希望你们会喜欢喔文艺晚会结束语一女1：最明快的，莫过于一年一度...
红色经典诵读主持词
红色经典诵读主持词红色经典诵读主持词尊敬的各位领导、敬爱的老师、亲爱的同学们 ：大家好!甲：今天的阳...
答谢会主持词
答谢会主持词15篇 主持词要根据活动对象的不同去设置不同的主持词。随着中国在不断地进步，主持人在活...
年会游戏主持词
年会游戏主持词 主持词没有固定的格式，他的最大特点就是富有个性。在人们积极参与各种活动的今天，主持...
《我是女王》经典台词及剧情介...
《我是女王》经典台词及剧情介绍 一、经典台词 一个偶尔会消失的男人，总有一天会永远的消失。 女...
追梦的主持串词
关于追梦的主持串词 篇一：梦想串词 各位老师，大家好： 又到了一个追梦的季节。春之漫妙、夏之热...
生日宴会精彩致辞
生日宴会精彩致辞（精选5篇） 在日常学习、工作抑或是生活中，大家都不可避免地会接触到致辞吧，致辞是...
暨迎元旦合唱比赛主持词
暨迎元旦合唱比赛主持词 主持词没有固定的格式，他的最大特点就是富有个性。在当下这个社会中，很多场合...