您的当前位置:首页正文

Canvas基本图形-路径

2022-06-15 来源:知库网

绘制路径

图形的基本元素是路径。路径是通过不同颜色和宽度的线段或曲线相连形成的不同形状的点的集合。一个路径,甚至一个子路径,都是闭合的。使用路径绘制图形需要一些额外的步骤。

  1. 首先,你需要创建路径的起始点
  2. 然后你要使用画图命令去画出路径
  3. 之后你需要把路径闭合
  4. 一旦路径生成,你就能通过描边或填充路径区域来渲染图形。

以下是要用到的函数:

beginPath()新建一条路径,生成之后,图形绘制命令被指向到路径上生成路径

closePath()闭合路径之后图形绘制命令又重新指向到上下文中

stroke()通过线条绘制图形轮廓

fill()通过填充路径内容区域生成实心图形


生成路径的第一步叫做beginPath()。本质上,路径是由很多子路径构成,这些子路径都是在一个列表中,所有的子路径(线、弧形、等等)构成图形。而每次这个方法调用之后,列表清空重置,然后我们就可以重新绘制新的图形。

第二步就是调用函数指定绘制路径,本文稍后我们就能看到了。

第三,就是闭合路径closePath(),不是必需的。这个方法会通过绘制一条从当前点到开始点的直线来闭合图形。如果图形是已经闭合了的,即当前点为开始点,该函数什么也不做。

显示全文