clearRect() trong Canvas

Xóa toàn bộ điểm trong khung hình chữ nhật Trình duyệt của bạn không hỗ trợ thẻ canvas trong HTML5. Code: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 < ! DOCTYPE html > < html > ...

Xóa toàn bộ điểm trong khung hình chữ nhật

Trình duyệt của bạn không hỗ trợ thẻ canvas trong HTML5.

Code:

<!DOCTYPE html>

<html>

<body>

<canvas id="myCanvas" awidth="300" height="150" style="border:1px solid #d3d3d3;">Trình duyệt của bạn không hỗ trợ thẻ canvas trong HTML5.</canvas>

var c = document.getElementById("myCanvas");

var ctx = c.getContext("2d");

ctx.fillStyle = "red";

ctx.fillRect(0, 0, 300, 150);

ctx.clearRect(20, 20, 100, 50);

</script>

</body>

</html>

Demo

Số trong bảng dưới đây thể hiện phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ cho thuộc tính.

Thuộc tính
clearRect()	4.0	2.0	9.0	3.1	9.0

Phương thức clearRect() dùng để xóa toàn bộ pixels nằm trong hình chữ nhật.

Cú pháp JavaScript: context.clearRect(x,y,awidth,height);

Tham số	Miêu tả
x	Tọa độ X của góc trái phía trên của hình chữ nhật
y	Tọa độ Y của góc trái phía trên của hình chữ nhật
awidth	Chiều dài của hình chữ nhật, tính bằng pixels
height	Chiều cao của hình chữ nhật, tính bằng pixels

Bình luận về bài viết này

Hoàng Hải Đăng

24 chủ đề

7226 bài viết