项目中做了移动端rem适配的,然而发现电脑上可行,在苹果手机上却无法显示,
查了一下,发现iOS Safari只支持标准的canvas,标准的canvas只支持px不支持rem。
上网找了一下,解决方法:
将rem转换回px
//UI设计基础宽度:750px;
ctx.font = 3*12.5+"px sans-serif";
但是移动端有各种宽度的屏幕,为了适应各种屏幕是不能写死,所以最终下法应该如下:
//获取设备宽度
let clientWidth = document.documentElement.clientWidth;
//根据设计图中的canvas font字体的占比进行设置
let fontWidth = clientWidth*3*12.5/750;
//设置自适应的字体大小
ctx.font = fontWidth+"px sans-serif";