初识 canvas 绘图

canvas 高大上的词，我居然也会用

第一次使用，我用它实现了,番茄时光里面的背景，读秒变黑的效果

中间遇到的困难

1. 画布需要清空，否则会有好多图同时绘制，╮(╯▽╰)╭ 清空画布代码放在下面了

       clearCanvas() {
                  var c = document.getElementById("can1");
                  var cxt = c.getContext("2d");
                  c.height = this.clientHeight;
              }
   

2. canvas标签的大小要设置好，它本身是有比例的，不可以随意设置，否则绘制出来的图是畸形的，但代码是没错的，记录下此坑
3. 想要给canvas图像动态赋值图像改变好像不行，这里的赋值说的是通过画布外参数影响绘画的进度，我想了半天给出的解决办法就是，清空画布直接重新画，无奈，不知道这样子会不会太耗内存...
4. ctx.translate(x,y)重设画布起点很好用

最后附上 canvas 的接口文档