1. HTML canvas là gì?
Phần tử <canvas>trong HTML được sử dụng để vẽ đồ họa một cách nhanh chóng, thông qua JavaScript
Phần tử <canvas> chỉ là một vùng chứa cho đồ họa. Bạn phải sử dụng JavaScript để vẽ đồ họa
Canvas có một số phương pháp để vẽ đường dẫn, hộp, hình tròn, văn bản và thêm hình ảnh
Các số trong bảng chỉ định hỗ trợ cho phần tử <canvas>:
| Tình duyệt |  |
 |
 |
 |
 |
| <canvas> | 4.0 | 9.0 | 2.0 | 3.1 | 9.0 |
2. Ví dụ về canvas cơ bản
Canvas là một vùng hình chữ nhật trên trang HTML. Theo mặc định, canvas không có đường viền và không có nội dung
Ví dụ:
Ở ví dụ trên là ví dụ về một canvas rỗng, cơ bản
Lưu ý: Luôn chỉ định một thuộc tính id (được tham chiếu trong tập lệnh) và một thuộc tính width và height để xác định kích thước của canvas. Để thêm đường viền, hãy sử dụng thuộc tính style
3. Cách thêm JavaScript vào canvas
Sau khi tạo vùng canvas hình chữ nhật, bạn phải thêm JavaScript để vẽ
3.1 Vẽ đường thẳng
Ví dụ:
3.2 Vẽ vòng tròn
Ví dụ:
3.3 Thêm một văn bản
Ví dụ:
Ta có thể làm chữ có nét bằng cách sau:
3.4 Vẽ dải màu
- Vẽ dải màu tuyến tính
Ví dụ:
- Vẽ giải màu hình tròn
Ví dụ:
