不用担心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. Spark Executor内幕彻底解密：Executor工作原理图、ExecutorBackend注册源码解密、Executor实例化内幕、Executor具体工作内幕

    本课主题 Spark Executor 工作原理图 ExecutorBackend 注册源码鉴赏和 Executor 实例化内幕 Executor 具体是如何工作的 Spark Executor 工作 ...

  2. zt 李鸿章听过《彩云追月》？

    ZT 李鸿章听过<彩云追月>? 2013-05-11 09:35:52 编辑 删除 归档在 观世上之音 | 浏览 1041 次 | 评论 1 条 尝试在网上找一点有关<彩云追月> ...

  3. Windows Server 2008 安装wampserver失败的总结

    1.最好选择2.4以下版本. 2.如果报确实MSVCR100.dll的错误,需要下载运行环境包(参考博客)

  4. 一对一关联关系基于主键映射的异常 IdentifierGenerationException

    具体异常:org.hibernate.id.IdentifierGenerationException: attempted to assign id from null one-to-one pro ...

  5. BIND简易教程（0）：在Ubuntu下源码安装BIND（其实跟前面的教程没太大关系）

    之前介绍过BIND的基本使用啦.关于BIND的入门级使用方法见:http://www.cnblogs.com/anpengapple/p/5877661.html简易教程系列,本篇只讲BIND安装. ...

  6. pypy入门：pypy的安装及使用介绍

    在做python开发的人,应该或多或少的听说过一点pypy吧.我猜.所以就不做背景介绍了,有不懂的同学可以看看这里: 1.什么是pypy: http://www.360doc.com/content/ ...

  7. datetime.datetime.now()时间格式转化是碰到的问题

    import datetime print datetime.datetime.now() # 2016-03-28 17:16:00.812000 a = ‘2016-03-28 17:16:00. ...

  8. CentOS下go 安装

     go 语言源码安装依赖 ,gcc ,make glibc库,等,上述工具安装省略,另外,其源代码更新采用的是mercurial 工具,安装前先安装mercureal :   1.mercurial安 ...

  9. zabbix-agent安装

    1.下载yum源库 rpm -i http://repo.zabbix.com/zabbix/3.4/rhel/7/x86_64/zabbix-release-3.4-2.el7.noarch.rpm ...

  10. socket相关的开机初始化分析

    针对内核3.9 系统开启时,会使用init/main.c,然后再里面调用kernel_init(),在里面会再调用do_basic_setup(),调用do_initcalls(),调用do_one_ ...