背景是用户电脑分辨率自己设置了 150%
放大显示,但我们的可视化大屏在放大后,图表的数据显示会很紧凑
又不能提示让客户自己去改成 100%
显示,因为我们的大屏上不只是图表,其它的布局倒没什么影响,用户也喜欢放大看
于是需求就是我要用 zoom
自动给用户缩回去正常的图表大小,正常这事在页面初始化的时候干就完了,zoom = 1 / window.devicePixelRatio
,但 zoom
会引起重绘,用起来还是要当心点
我原本想避免 window.devicePixelRatio = 1
时候就不执行 zoom = 1
这个逻辑了
但心存疑惑:初始时如果没有 zoom
应该默认值是 1
,我再设置 zoom=1
,按道理是不会引起页面变化的,应该不会引起重绘
默默打开控制台 写个 5s
后执行 document.body.style.zoom = 1
的 setTimeout
,再用 Chrome Performance
录制下过程,发现确实没有引起重绘,是我多虑了