Méthode stroke

La méthode stroke est appelée pour terminer le dessin d'une ligne avec lineTo, ainsi que pour contourner avec un trait les formes dessinées, par exemple via la méthode rect.

Syntaxe

javascriptcontexte.stroke()

Exemple

Dessinons une ligne :

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.stroke();

Результат:

Exemple

Dessinons un carré :

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet 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();

Результат:

Voir aussi

  • la méthode fill,
    qui remplit une forme avec un fond
  • la propriété strokeStyle,
    qui définit la couleur de la ligne