Phương thức closePath() của Canvas
Định nghĩa và cách sử dụng
closePath() phương thức tạo đường dẫn từ điểm hiện tại đến điểm bắt đầu.
Lưu ý:Sử dụng stroke() phương thức để vẽ đường dẫn chính xác trên canvas.
Lưu ý:Sử dụng fill() Sử dụng phương thức để tô ảnh (mặc định là màu đen). Hãy sử dụng fillStyle Thuộc tính để tô màu hoặc dải màu khác.
Ví dụ
Ví dụ 1
Vẽ một đường dẫn có hình dạng chữ L, sau đó vẽ đường để trở về điểm bắt đầu:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.closePath();
ctx.stroke();
Lưu ý:Nhiều ví dụ khác được cung cấp ở cuối trang.
Cú pháp
context.closePath();
Các ví dụ khác
Ví dụ 2
Chọn màu xanh lá cây làm màu tô:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.closePath();
ctx.stroke();
ctx.fillStyle="green";
ctx.fill();
Hỗ trợ trình duyệt
Số liệu trong bảng chỉ ra phiên bản trình duyệt đầu tiên hoàn toàn hỗ trợ thuộc tính này.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Ghi chú:Internet Explorer 8 và các phiên bản sớm hơn không hỗ trợ phần tử <canvas>.
