canvas画的文字在安卓移动设备上可以显示,但是在ios移动设备上无法显示
不用担心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移动设备上无法显示的更多相关文章
- Android自定义View 画弧形,文字,并增加动画效果
一个简单的Android自定义View的demo,画弧形,文字,开启一个多线程更新ui界面,在子线程更新ui是不允许的,但是View提供了方法,让我们来了解下吧. 1.封装一个抽象的View类 B ...
- 使用javascript和canvas画月半弯
使用javascript和canvas画月半弯,月半弯好浪漫!浏览器须支持html5 查看效果:http://keleyi.com/a/bjad/8xqdm0r2.htm 以下是代码: <!do ...
- Canvas 3D球形文字云动画特效
Canvas 3D球形文字云动画特效 效果图: 代码如下,复制即可使用: (适用浏览器:360.FireFox.Chrome.Opera.傲游.搜狗.世界之窗. 不支持Safari.IE8及以下浏览器 ...
- 10分钟,利用canvas画一个小的loading界面
首先利用定义下canvas得样式 <canvas width="1024" height="720" id="canvas" styl ...
- Android利用canvas画各种图形
Android利用canvas画各种图形(点.直线.弧.圆.椭圆.文字.矩形.多边形.曲线.圆角矩形) 本文链接:https://blog.csdn.net/rhljiayou/article/det ...
- canvas 画圈 demo
html代码: <canvas id="clickCanvas2" width="180" height="180" data-to ...
- 踩个猴尾不容易啊 Canvas画个猴子
踩个猴尾不容易啊 Canvas画个猴子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...
- canvas画随机闪烁的星星
canvas画一颗星星: 规则的星星有内切圆和外切圆,每两个点之间的角度是固定的,因此可得到星星的每个点的坐标,画出星星. function drawStars(x,y,radius1,radius2 ...
- HTML5 Canvas实现黑客帝国文字掉落效果
效果: 原理: 用canvas逐行输出文字,然后让背景颜色逐渐加深,再随机中断某些列. 代码: HTML: <canvas id="c"></canvas> ...
随机推荐
- SAP CRM One order里user status和system status的mapping逻辑
Below example show: How the mapping relationship between User status and System status maintained in ...
- sublime text html5开发学习 插件篇记录
1.第一步先按照 Package Control,具体步骤自行百度,Google. 2. view in browser 默认的快捷键应该是这样的,我用的是IE浏览器.所以ctrl+alt+i 即可让 ...
- 理解Underscore中的flatten函数
最近是在所在实习公司的第一个sprint,有个朋友又请假了,所以任务比较重,一直这么久都没怎么更新了,这个周末赖了个床,纠结了一会儿决定还是继续写这个系列,虽然比较乏味,但是学到的东西还是很多的. 之 ...
- 对HandlerExecutionChain类的理解分析
HandlerExecutionChain类比较简单,好理解. ==================================================================== ...
- 「LG4782 模板 2-SAT 问题」
题目 来学\(2\)-\(sat\)了 这个东西确实不难 这个算法就是给你一堆\(bool\)变量\(x_1,x_2...x_n\),之后给你一些限制 限制的形式就是给你一对\((u,o1,v,o2) ...
- PHP-----TP框架基础
TP框架基础 把Thinkphp框架的压缩包解压到php文件夹下----www目录下. Thinkphp文件夹都有什么呢??? (所有用TP框架做的程序,要访问程序里面的网页.内容的话,全部要走这 ...
- PHP----作业:查询数据显示在页面上
作业: 查询INFO表所有数据,显示在页面上(表格)性别要显示男女 民族 显示民族名称 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tra ...
- CentOS 7安装简介及基本操作
计算机基本概念: 1.计算机硬件组成: 2.计算机系统结构: 3.操作系统的功能:硬件驱动.进程管理.内存管理.网络管理.安全管理.文件管理等. 4.OS通用目的的软件程序:用户<-->应 ...
- ASP.NET Core中怎么实现Url rewrite功能
我们可以使用ASP.NET Core的中间件来实现Url rewrite功能,下面我们定义一个中间件ReplaceQueryStringMiddleware来替换Http请求中的Url参数即Query ...
- Vue教程:指令与事件(二)
一.插值 v-once 通过使用 v-once 指令,你也能执行一次性地插值,当数据改变时,插值处的内容不会更新.但请留心这会影响到该节点上所有的数据绑定: span v-once>这个将不会改 ...