The first step to create a path is to call the beginPath(). fill()ĭraws a solid shape by filling the path's content area. stroke()ĭraws the shape by stroking its outline. closePath()Īdds a straight line to the path, going to the start of the current sub-path. Methods to set different paths for objects. Once created, future drawing commands are directed into the path and used to build the path up. Here are the functions used to perform these steps: beginPath()Ĭreates a new path. Once the path has been created, you can stroke or fill the path to render it.Then you use drawing commands to draw into the path.To make shapes using paths, we take some extra steps:

A path, or even a subpath, can be closed. A path is a list of points, connected by segments of lines that can be of different shapes, curved or not, of different width and of different color.