echarts的tooltip在Canvas内显示不全问题、全屏不显示问题

文章讲述了作者在使用Echarts绘制雷达图时遇到的显示问题,首先通过设置appendToBody为true解决了部分显示问题,但当尝试全屏显示时,图表不再显示。作者检查了数据、Canvas样式,并尝试添加滚动条,最后通过官方文档发现confine属性并设置为true,成功将图表限制在容器内,解决了全屏显示问题。
摘要由CSDN通过智能技术生成

总结一条,对echarts的各项属性值不够了解,充分了解开发进度快如闪电~

上问题:

测试说画的雷达图显示不全,如下图:

网上找了资料,配置了appendToBody: true(没错,就是被我注释掉的那个!)效果完美有木有?

就在我沾沾自喜感谢伟大的度娘以及网友大神后,测试又双叒叕的来了,说大屏后直接不显示了(我们还要做全屏展示,也就是你面前的整个屏幕),我一打开全屏,我直接好家伙,确实不显示了,解题思路如下:

1、我首先考虑的是不是我大屏后echarts把我的数据清掉了,发现并没有;

2、然后去看生成的Canvas内的样式,因为在element-ui遇到过相似的问题(应该发过文章,没有的话@我,我去补),发现正常屏和全屏下源代码中的样式一样;

3、然后感觉改不了了,和产品对接,产品说能不能加滚动条?我首先想到overflow属性,思考了一会,这是浮窗啊喂,肯定去找echarts配置项啊,找也找不到滚动条

4、就在我即将彻底放弃的时候,我扒拉着官方文档偶然发现了一个配置项,没错!就是我留下的那个唯一属性confine:true,把它牢牢的限制在框里,效果完(嗯……不说完美了,拍被打脸)

哼(傲娇脸),手动李云龙士兵表情包,我去交差去!!

 

 

 

 

 

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值