Método closePath() da tela HTML

❮ Referência de tela HTML

Exemplo

Desenhe um caminho, com a forma da letra L e, em seguida, desenhe uma linha de volta ao ponto inicial:

Seu navegador não suporta a tag HTML5canvastag.

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();

Suporte ao navegador

Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao método.

Method
closePath() Yes 9.0 Yes Yes Yes

Definição e uso

O método closePath() cria um caminho do ponto atual de volta ao ponto inicial.

Dica: Use o método stroke() para realmente desenhar o caminho na tela.

Dica: Use o método fill() para preencher o desenho (preto é o padrão). Use a propriedade fillStyle para preencher com outra cor/gradiente.

Sintaxe JavaScript: contexto .closePath();

Mais exemplos

Exemplo

Use vermelho como a cor de preenchimento:

O seu navegador não suporta ocanvastag.

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();

❮ Referência de tela HTML