不用担心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. July 21st 2017 Week 29th Friday

    If you want to fly too high in relation to the horizon forget. 要想飞得高,就该把地平线忘掉. Always keep our eyes ...

  2. 全国大学生数据挖掘邀请赛中的NDCG

    转:http://www.zhizhihu.com/html/y2011/2794.html 评价标准 性能良好的评分模型,应该能够给予那些引起msg或click的候选会员更高的评分(排序靠前),从而 ...

  3. S/4HANA服务订单Service Order的批量创建

    我工作中接到一个任务,需要在性能测试系统里创建一亿条服务订单service order来做性能测试. 这么大规模的数据量,当然只能用代码来创建了. 本文提到的所有ABAP代码,我均已上传到我的Gith ...

  4. [AHOI2004]数字迷阵

    嘟嘟嘟 应该算一道结论题吧. 首先很明显的一点,就是对于ai,j,我们只用求出ai,1就行了,剩下的就是斐波那契和矩阵快速幂的事. 至于如何求ai,1,用两种方法,但是哪一个我都不懂为啥,网上也没有解 ...

  5. 由.def文件生成lib文件[转]

    最近在学习curl库时,碰到一个问题,从官网上下载了一个lib版的,却发现只有.dll,没有lib文件,感觉很奇怪,google了之后才知道,原来库作者的用意是让用户自己生成lib文件,下载到的lib ...

  6. Cesium.js点击事件

    创建viewer var viewer = new Cesium.Viewer('cesiumContainer'); 鼠标事件 var handler = new Cesium.ScreenSpac ...

  7. MVC导航菜单高亮显示实现思路

    ///代码不是我写的,但是已经亲自测试过了,按照我的理解写的注释,不对的地方大家评论指出 @{ @*这个是把当前的路由值格式化并保存到currentController这个变量中,这里是格式化为Con ...

  8. 数据库——MySQL——事务

    数据的事务是指作为单个逻辑工作单元执行的一系列操作,要么完全执行,要么完全不执行. 事务必须具备四个特性: 原子性 原子性是指事务包含的所有操作要么全部成功,要么全部失败回滚 一致性 在事务T开始时, ...

  9. Python 学习笔记(十二)Python文件和迭代(一)

    文件 文件和文件夹 文件:文本文件.二进制文件 文件夹:(windows) G:\pythonWorkspace\python\study (linux/mac) /home/workspace/py ...

  10. 轻量ORM-SqlRepoEx (六) JOIN

    示例使用的是最新 SqlRepoEx 2.0.2 可在:https://github.com/AzThinker/SqlRepoEx2.0Demo 或:https://gitee.com/azthin ...