Atributo lineCap do Canvas

Definição e uso

lineCap Atributo que define ou retorna o estilo do chapeu na extremidade da linha.

Observação:"round" e "quadrado" fará a linha parecer um pouco mais longa.

Exemplo

Desenhar o final do chapeu circular:

Seu navegador não suporta a tag canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.lineCap="round";
ctx.moveTo(20,20);
ctx.lineTo(20,200);
ctx.stroke();

Experimente você mesmo

Sintaxe

context.lineCap="butt|round|square";

Valor do atributo

Valor Descrição
butt Padrão. Adicione uma borda reta em cada extremidade da linha.
round Adicione uma linha de chapeu circular em cada extremidade da linha.
quadrado Adicionar capuchões quadrados a cada extremidade da linha.

Detalhes técnicos

Valor padrão: butt

Suporte do navegador

Os números na tabela indicam a versão do navegador que suportou a propriedade pela primeira vez.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Observação:O Internet Explorer 8 e versões anteriores não suportam o elemento <canvas>.