19/09/2018, 15:01

ImageData width trong Canvas

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 < ! DOCTYPE html > < html > < body > < canvas id = "myCanvas" awidth = "300" height = ...

<!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");

var imgData = ctx.createImageData(100, 100);

alert("Chiều dài của imgData là: " + imgData.awidth);

var i;

for (i = 0; i < imgData.data.length; i += 4) {

imgData.data[i+0] = 255;

imgData.data[i+1] = 0;

imgData.data[i+2] = 0;

imgData.data[i+3] = 255;

}

ctx.putImageData(imgData, 10, 10);

</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
ImageData awidth	4.0	2.0	9.0	3.1	9.0

Thuộc tính awidth trả về độ dài của một đối tượng ImageData, với đơn vị tính là pixel.

Mẹo: Xem createImageData(), getImageData() và putImageData() để tìm hiểu thêm về đối tượng ImageData.

Cú pháp JavaScript: imgData.awidth;

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

Tạ Quốc Bảo

23 chủ đề

7270 bài viết