HTML canvas closePath() Method

Canvas Object : Draw a path, shaped as the letter L, and then draw a line back to the starting point

Browser Support

The numbers in the table specify the first browser version that fully supports the method.

Method
closePath()	4.0	9.0	3.6	4.0	10.1

Definition and Usage

The closePath() method creates a path from the current point back to the starting point.

Tip: Use the stroke() method to actually draw the path on the canvas.

Tip: Use the fill() method to fill the drawing (black is default). Use the fillStyle property to fill with another color/gradient.

JavaScript syntax:	context.closePath();

More Examples

Example

Use red as the fill color:

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(20, 100);
ctx.lineTo(70, 100);
ctx.closePath();
ctx.stroke();
ctx.fillStyle = "red";
ctx.fill();

❮ Canvas Object

Contact US

Email: