不用担心iOS Safari不支持canvas,查看https://caniuse.com/ 发现是支持的

ctx.font = "0.16rem Arial";

为了适配移动端直接用了rem,但是iOS Safari只支持标准的canvas,标准的canvas只支持px不支持rem,所以文字不显示。

解决方案是换成px

var clientWidth = document.documentElement.clientWidth;
var fontWidth = clientWidth*2*12.5/750;
//设置自适应字体大小
ctx.font = fontWidth + "px Arial";

canvas画的文字在安卓移动设备上可以显示,但是在ios移动设备上无法显示的更多相关文章

  1. Android自定义View 画弧形,文字,并增加动画效果

    一个简单的Android自定义View的demo,画弧形,文字,开启一个多线程更新ui界面,在子线程更新ui是不允许的,但是View提供了方法,让我们来了解下吧. 1.封装一个抽象的View类   B ...

  2. 使用javascript和canvas画月半弯

    使用javascript和canvas画月半弯,月半弯好浪漫!浏览器须支持html5 查看效果:http://keleyi.com/a/bjad/8xqdm0r2.htm 以下是代码: <!do ...

  3. Canvas 3D球形文字云动画特效

    Canvas 3D球形文字云动画特效 效果图: 代码如下,复制即可使用: (适用浏览器:360.FireFox.Chrome.Opera.傲游.搜狗.世界之窗. 不支持Safari.IE8及以下浏览器 ...

  4. 10分钟,利用canvas画一个小的loading界面

    首先利用定义下canvas得样式 <canvas width="1024" height="720" id="canvas" styl ...

  5. Android利用canvas画各种图形

    Android利用canvas画各种图形(点.直线.弧.圆.椭圆.文字.矩形.多边形.曲线.圆角矩形) 本文链接:https://blog.csdn.net/rhljiayou/article/det ...

  6. canvas 画圈 demo

    html代码: <canvas id="clickCanvas2"  width="180" height="180" data-to ...

  7. 踩个猴尾不容易啊 Canvas画个猴子

    踩个猴尾不容易啊  Canvas画个猴子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

  8. canvas画随机闪烁的星星

    canvas画一颗星星: 规则的星星有内切圆和外切圆,每两个点之间的角度是固定的,因此可得到星星的每个点的坐标,画出星星. function drawStars(x,y,radius1,radius2 ...

  9. HTML5 Canvas实现黑客帝国文字掉落效果

    效果: 原理: 用canvas逐行输出文字,然后让背景颜色逐渐加深,再随机中断某些列. 代码: HTML: <canvas id="c"></canvas> ...

随机推荐

  1. Linux 命令行 发送邮件

    1.mail -s hi xx@yy.com 给xx@yy.com发一封主题为hi的信(没有正文) 编辑完内容后Ctrl-D结束. 2.echo "This is a test mail!& ...

  2. Sql去重一些技巧

    下午的时候遇到点问题,Sql去重,简单的去重可以用 DISTINCT 关键字去重,不过,很多情况下用这个解决不了问题.重复的数据千变万化,例如:类似于qq.微信的最近联系人功能,读取这些数据肯定要和消 ...

  3. gpu 显卡 本质

    根据一切皆文件的理念,显卡.gpu.显示器是特殊的单向的只写文件.

  4. [零基础学pythyon]安装python编程环境

    不论什么高级语言都是须要一个自己的编程环境的,这就好比写字一样,须要有纸和笔,在计算机上写东西.也须要有文字处理软件,比方各种名称的OFFICE.笔和纸以及office软件,就是写东西的硬件或软件.总 ...

  5. C/C++心得-理解指针

    上一篇笔者用自己那不是怎么好理解的逻辑介绍了内存和C中的基本数据类型,现在笔者再根据自己重新所学来说说C语言中的指针. 理解指针才能真正的算C语言入门.也许是我大学期间太关注前端UE,也许是当初开始学 ...

  6. HDU 6464 免费送气球 【权值线段树】(广东工业大学第十四届程序设计竞赛)

    传送门:http://acm.hdu.edu.cn/showproblem.php?pid=6464 免费送气球 Time Limit: 2000/1000 MS (Java/Others)    M ...

  7. ICompare 可比较接口

    执行

  8. 简单说一说对JavaScript原型链的理解

    每一个JavaScript对象都和另一个对象相关联,相关联的这个对象就是我们所说的“原型”.每一个对象都会从原型继承属性和方法.有一个特殊的对象没有原型,就是Object,还有一种通过Object.c ...

  9. NSLog的各种打印格式符 和 打印CGRect时用NSStringFromCGRect

    打印CGRect时用NSStringFromCGRect 转载自:http://blog.csdn.net/chenyong05314/article/details/8219270 1. 打印CG开 ...

  10. ARM Linux 内核 panic 之cache 一致性 ——Cortex-A9多核cache和TLB一致性广播

    ARM Linux 内核 panic 之cache 一致性 ——Cortex-A9多核cache和TLB一致性广播 Cortex-A9的多喝CPU可以接收和执行一致性广播操作,当其使能并处于SMP模式 ...