HTML5 Canvas - Vẽ hình chữ nhật
Có ba phương thức để vẽ các hình chữ nhật trên canvas:
| STT | Phương thức và Miêu tả |
|---|---|
| 1 | fillRect(x,y,width,height) Phương thức này vẽ một hình chữ nhật được fill. |
| 2 | strokeRect(x,y,width,height) Phương thức này vẽ một outline hình chữ nhật |
| 3 | clearRect(x,y,width,height) Phương thức này xóa khu vực đã xác định và làm nó hoàn toàn trong suốt |
Ở đây x và y xác định vị trí trên canvas (liên quan tới điểm gốc) của góc trên cùng bên trái của hình chữ nhật và width và height là độ rộng và chiều cao của hình chữ nhật.
Ví dụ
Sau đây là một ví dụ đơn giản mà sử dụng các phương thức trên để vẽ một hình chữ nhật đẹp.
Nó sẽ vẽ hình chữ nhật sau:
Bài học HTML5 phổ biến khác tại hoconline.club:
canvas_trong_html5.jsp
Bài viết liên quan