首页 > 代码库 > 动画原理——绘画API

动画原理——绘画API

书籍名称:HTML5-Animation-with-JavaScript

书籍源码:https://github.com/lamberta/html5-animation

1.canvas的context

var canvas = document.getElementById(‘canvas‘), context = canvas.getContext(‘2d‘);

第一句是获取canvas节点。

第二句是获取一个 CanvasRenderingContext2D 对象,绘画功能如clearRect,lineTo等都是这个对象的属性.(getContext目前只支持2d)。

2.清除绘画

context.clearRect(x, y, width, height)  

前两个属性是开始的坐标,后两个是结束的坐标,目标函数的作用就是清空这两个点构成的正方形。如先前使用,实际就是清空整个画板。
context.clearRect(0, 0, canvas.width, canvas.height);

 

 

 

动画原理——绘画API