echarts tooltip被遮挡_echarts 的tooltip定位到当前图,避免溢出和遮挡

问题:tooltip初始是跟着鼠标移动,当内容过多(宽度高度过大),会被其他遮挡或者会溢出屏幕外

解决:

思路:根据官方文档,鼠标在左侧时,tip在右侧,鼠标在右侧时,tip在左侧,这样不会溢出,太高或太宽可以设置滚动条,这样也不会被遮挡

9daa194e6eff6cec023f2b1e849f2cae.png

改进:

1、因为内容过多,展示不完全有滚动条,所以需要鼠标能实时移到tip上进行详细查看,所以运用了 enterable:true,属性,能够定住tip,

2、position参数dom是当前得tip容器,若想要其他样式得tip,给dom添加css即可

3、屏幕适配问题,小屏溢出屏幕(这里可能tooltip里的数据内容有宽有窄,不同的宽度与左右的间距不一样)

//图得tips位置