在Canvas API中，上下文CanvasRenderingContext2D对象提供了一个与坐标旋转相关的方法： void rotate(in float angle); // 按给定的弧度顺时针旋转angle rotate（）方法旋转的中心始终是canvas的原点。如果要改变旋转中心，需要使用 ...
分类：
编程语言 时间：
2020-06-25 09:27:06
阅读次数：
101
在Canvas API中，上下文CanvasRenderingContext2D对象提供了一个与坐标旋转相关的方法： void rotate(in float angle); // 按给定的弧度顺时针旋转angle 利用rotate（）方法可以很方便地将绘制的图形旋转。下面我们通过对正方形进行旋转变 ...
分类：
编程语言 时间：
2020-06-25 09:19:50
阅读次数：
107
引子 在最近的工作中碰到了合成图片的需求，首先想到的便是 canvas，到网上查找了一些资料，大部分也是使用 canvas。因为好久没有实际接触过这方面的东西了，感觉到一些兴奋。预估会收获不少。 Origin My GitHub 宽高问题 因为是在手机上，需要进行不同尺寸的适配，在项目中使用的是 r ...
分类：
其他好文 时间：
2020-06-24 09:15:08
阅读次数：
69
1. 在html页面中引入canvas标签，设置大小 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s ...
分类：
Web程序 时间：
2020-06-22 18:49:21
阅读次数：
66
问题：在页面上添加了动画，切换页面后会报错，如下图： 报错是因为离开有动画的页面后，没有取消动画 // requestAnimationFrame方法启动的动画 this.timeIndex = requestAnimationFrame((time) => draw(time, canvas, c ...
分类：
其他好文 时间：
2020-06-22 11:03:25
阅读次数：
113
canvas绘制原理和传统dom不一样,canvas是串行绘制，因此代码的先后顺序交换并不是等效的。想要覆盖其他元素，那么只需要在其后调用绘制方法即可覆盖。 无限循环图片可以采用两张一样的图片头尾相接展示。 requestAnimationFrame理想情况会以每秒60次速度执行，如果某些需求需要降 ...
分类：
其他好文 时间：
2020-06-21 00:45:41
阅读次数：
105
#HTML5知识点汇总 ##HTML5 中的一些有趣的新特性 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar ...
分类：
Web程序 时间：
2020-06-20 13:59:40
阅读次数：
66
//解决echarts图中canvas父级div宽度问题 var a = document.getElementsByTagName("canvas")[2]; var par = a.parentNode; par.style.width = 800+'px'; a.style.width = 8 ...
分类：
其他好文 时间：
2020-06-19 16:22:37
阅读次数：
203
该方法用于裁剪画布，也就是设置画布的显示区域调用clipRect()方法后，只会显示被裁剪的区域，之外的区域将不会显示该方法最后有一个参数Region.Op，表示与之前区域的区域间运算种类，如果没有这个参数，则默认为Region.Op.INTERSECT这几个参数的意义为： DIFFERENCE 是 ...
分类：
其他好文 时间：
2020-06-19 12:26:59
阅读次数：
71
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> canvas{ border: 1px solid red; } </style> </head> <body s ...
分类：
其他好文 时间：
2020-06-18 21:38:23
阅读次数：
65
