Método stroke
El método stroke se llama para completar
el dibujo de una línea con lineTo,
así como para trazar el contorno de figuras dibujadas,
por ejemplo, mediante el método rect.
Sintaxis
contexto.stroke()
Ejemplo
Dibujemos una línea:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.stroke();
:
Ejemplo
Dibujemos un cuadrado:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.lineTo(150, 150);
ctx.lineTo(50, 150);
ctx.closePath();
ctx.stroke();
:
Ver también
-
método
fill,
que se utiliza para rellenar una figura con fondo -
propiedad
strokeStyle,
que establece el color de la línea