Canvas Learning

学习canvas,但愿不要入门到放弃

看着w3c里面的Canvas学习系列文章,跟着敲

偷懒没有把所有代码都区分开分成文件.代码里的注释大部分都是一些小demo的演示

2018-01-17

• canvas入门准备

  了解canvas基本知识

• canvas坐标系统

• 坐标变换

• 绘制线段

• 绘制虚线和圆点线

• 线型

• save()和restore() //看了一半

2018-01-22

在MDN看了一遍教程

接下来要学习动画！

• 基本用法
• 绘制形状
• 添加样式和颜色
• 绘制文本
• 使用图片
• 变形

2018-01-31

• 合成与裁剪
• 基本动画

2018-02-02

• 在sf上看到大佬做的 前端系列——canvas实现按住鼠标移动绘制出轨迹 于是效仿着做了一个一样的

2018-02-04

继续学动画

• 高级动画

2018-02-12

• 像素操作

2018-02-13

• 点击区域和无障碍访问

2018-02-23

• 在sf上看到大佬做的《每周一点canvas动画》—— 文字粒子遂照着敲了一遍，膜拜之

2018-03-05

• 更新自己实现的一个效果 —— 鼠标移动到画布上显示遮罩后面的图片的部分

2018-05-02

• 补更新：利用chrome人脸识别API实现一个简单的视频人脸识别demo。demo

  • 参考前端人脸检测指南

• 今日更新: canvas 粒子效果 实现自由滚动 接近连线功能。demo

  • 参考炒鸡简单的canvas粒子
  • 参考canvas 会动的粒子效果
  • 参考JS HEX十六进制与RGB, HSL颜色的相互转换

---

加油学习