canvas初识笔记

HTML DOM getContext() 方法：

getContext() 方法返回一个用于在画布上绘图的环境。

Canvas.getContext(contextID)
参数 contextID 指定了您想要在画布上绘制的类型。当前唯一的合法值是 "2d"，它指定了二维绘图，并且导致这个方法返回一个环境对象，该对象导出一个二维绘图 API。

fillStyle 属性

fillStyle 属性设置或返回用于填充绘画的颜色、渐变或模式。

context.fillStyle=color|gradient|pattern;

color	指示绘图填充色的 CSS 颜色值。默认值是 #000000。
gradient	用于填充绘图的渐变对象（线性或放射性）
pattern	用于填充绘图的 pattern 对象

fillRect() 方法

fillRect() 方法绘制“已填色”的矩形。默认的填充颜色是黑色。

context.fillRect(x,y,width,height);

x	矩形左上角的 x 坐标
y	矩形左上角的 y 坐标
width	矩形的宽度，以像素计
height	矩形的高度，以像素计

rotate() 方法旋转当前的绘图。 JavaScript 语法： context.rotate(angle); 参数值 参数 描述 angle 旋转角度，以弧度计。 如需将角度转换为弧度，请使用 degrees*Math.PI/180 公式进行计算。 举例：如需旋转 5 度，可规定下面的公式：5*Math.PI/180。