Canvas学习笔记(三)--绘图（路径【直线】）

1、绘制路径的方法

?

beginPath()：开始一个新路径。

?

closePath()：关闭路径。

?

stroke()：绘制路径边框。

?

fill()：使用颜色填充路径绘制的图形。

?

moveTo(x,y)：设置坐标的位置。

?

lineTo(x,y)：绘制一条直线。参数(x,y)是终点的坐标，起点坐标取决于前一路径（即：前一路径的终点就是当前路径的起点。可以通过moveTo()设置起始坐标。）

?

2、绘制路径的步骤

?

第一步：调用beginPath()创建路径。在内存里，路径是以一组子路径（直线、弧线等）进行存储，共同构成一个图形。每次调用beginPath()，子路径都会被重置，这样就可以绘制新的图形。

?

第二步：实际绘制路径。

?

第三步：调用closePath()关闭路径。尝试在当前端点通过直线连接起始端点来关闭图形。如果图形已经关闭 ? 或者只有一个点，则不会执行任何操作。这一步是可选的。

?

第四步：调用stroke()或者fill()，此时，图形才实际的绘制到canvas上。

?

注：使用fill()时，图形会自动闭合，不需要调用closePath().

?

3、绘制路径实例

?

?

?
?