Phương thức stroke

Phương thức stroke được gọi để hoàn thành việc vẽ đường thẳng với lineTo, cũng như để vẽ đường viền cho các hình dạng được vẽ, ví dụ, thông qua phương thức rect.

Cú pháp

javascriptngữ cảnh.stroke()

Ví dụ

Hãy vẽ một đường thẳng:

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

Результат:

Ví dụ

Hãy vẽ một hình vuông:

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

Результат:

Xem thêm