HTMLCanvasElement

Thuộc tính thể hiện

Kế thừa các thuộc tính từ giao diện cha, HTMLElement.

HTMLCanvasElement.height

Thuộc tính HTML height của phần tử <canvas> là một integer không âm, phản ánh số pixel logic (hoặc giá trị RGBA) đi xuống một cột của canvas. Khi thuộc tính không được chỉ định, hoặc được đặt thành giá trị không hợp lệ như số âm, giá trị mặc định 150 sẽ được dùng. Nếu không có CSS height riêng được gán cho <canvas>, giá trị này cũng sẽ được dùng làm chiều cao của canvas theo đơn vị CSS Pixel.

HTMLCanvasElement.width

Thuộc tính HTML width của phần tử <canvas> là một integer không âm, phản ánh số pixel logic (hoặc giá trị RGBA) đi ngang qua một hàng của canvas. Khi thuộc tính không được chỉ định, hoặc được đặt thành giá trị không hợp lệ như số âm, giá trị mặc định 300 sẽ được dùng. Nếu không có CSS width riêng được gán cho <canvas>, giá trị này cũng sẽ được dùng làm chiều rộng của canvas theo đơn vị CSS Pixel.

HTMLCanvasElement.mozOpaque Non-standard Deprecated

Một giá trị boolean phản ánh thuộc tính HTML moz-opaque của phần tử <canvas>. Nó cho canvas biết liệu độ trong suốt có phải là yếu tố cần xét đến hay không. Nếu canvas biết rằng không có độ trong suốt, hiệu năng vẽ có thể được tối ưu. Thuộc tính này chỉ được hỗ trợ trong các trình duyệt dựa trên Mozilla; hãy dùng canvas.getContext('2d', { alpha: false }) đã được chuẩn hóa thay thế.

HTMLCanvasElement.mozPrintCallback Non-standard

Một function ban đầu có giá trị null. Nội dung web có thể đặt nó thành một hàm JavaScript sẽ được gọi khi canvas cần được vẽ lại trong lúc trang đang được in. Khi được gọi, callback sẽ nhận một đối tượng "printState" triển khai giao diện MozCanvasPrintState. Callback có thể lấy context để vẽ từ đối tượng printState, rồi phải gọi done() khi hoàn tất. Mục đích của mozPrintCallback là tạo bản kết xuất của canvas có độ phân giải cao hơn, tương ứng với độ phân giải của máy in đang dùng. Xem bài đăng blog này.

Phương thức thể hiện

Kế thừa các phương thức từ giao diện cha, HTMLElement.

HTMLCanvasElement.captureStream()

Trả về một CanvasCaptureMediaStreamTrack là bản ghi video thời gian thực của bề mặt canvas.

HTMLCanvasElement.getContext()

Trả về một context vẽ trên canvas, hoặc null nếu mã định danh context không được hỗ trợ, hoặc canvas đã được đặt sang một chế độ context khác.

HTMLCanvasElement.toDataURL()

Trả về một data URL chứa biểu diễn của hình ảnh theo định dạng được chỉ định bởi tham số type (mặc định là png). Hình ảnh trả về có độ phân giải 96dpi.

HTMLCanvasElement.toBlob()

Tạo một đối tượng Blob biểu diễn hình ảnh chứa trong canvas; tệp này có thể được lưu trong bộ nhớ đệm trên đĩa hoặc lưu trong bộ nhớ tùy theo trình duyệt.

HTMLCanvasElement.transferControlToOffscreen()

Chuyển quyền điều khiển sang đối tượng OffscreenCanvas, trên main thread hoặc trên worker.

Sự kiện

Kế thừa các sự kiện từ giao diện cha, HTMLElement.

Nghe các sự kiện này bằng addEventListener() hoặc bằng cách gán trình xử lý sự kiện cho thuộc tính oneventname của giao diện này.

contextlost

Được kích hoạt nếu trình duyệt phát hiện context CanvasRenderingContext2D đã bị mất.

contextrestored

Được kích hoạt nếu trình duyệt khôi phục thành công một context CanvasRenderingContext2D.

webglcontextcreationerror

Được kích hoạt nếu user agent không thể tạo context WebGLRenderingContext hoặc WebGL2RenderingContext.

webglcontextlost

Được kích hoạt nếu user agent phát hiện bộ đệm vẽ gắn với đối tượng WebGLRenderingContext hoặc WebGL2RenderingContext đã bị mất.

webglcontextrestored

Được kích hoạt nếu user agent khôi phục bộ đệm vẽ cho đối tượng WebGLRenderingContext hoặc WebGL2RenderingContext.

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Phần tử HTML triển khai giao diện này: <canvas>