Atributo lineCap del canvas HTML

Definición y uso

lineCap Configuración de propiedades o devolución de la estilo del extremo del trazo.

Notas:"round" y "square"hará que la línea sea un poco más larga.

Ejemplo

Terminación del extremo del trazo del círculo:

Su navegador no admite la etiqueta 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();

Prueba por ti mismo

Sintaxis

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

Valor del atributo

Valor Descripción
butt Predeterminado. Añade bordes rectos a cada extremo de la línea.
round Añade un extremo redondo a cada extremo de la línea.
square Añade un extremo cuadrado a cada extremo de la línea.

Detalles técnicos

Valor predeterminado: butt

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite por primera vez esta propiedad.

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

Notas:Los navegadores Internet Explorer 8 y anteriores no admiten el elemento <canvas>.