Phương thức canvas createPattern () HTML

Hình ảnh sử dụng:

Đèn ngủ

Thí dụ

Lặp lại hình ảnh theo cả chiều ngang và chiều dọc:

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var img = document.getElementById("lamp");
var pat = ctx.createPattern(img, "repeat");
ctx.rect(0, 0, 150, 100);
ctx.fillStyle = pat;
ctx.fill();

Hỗ trợ trình duyệt

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phương pháp này.

Method
createPattern()	Yes	9.0	Yes	Yes	Yes

Định nghĩa và Cách sử dụng

Phương thức createPattern () lặp lại phần tử được chỉ định theo hướng đã chỉ định.

Phần tử có thể là hình ảnh, video hoặc phần tử <canvas> khác.

Phần tử lặp lại có thể được sử dụng để vẽ / tô các hình chữ nhật, hình tròn, đường thẳng, v.v.

Cú pháp JavaScript:	context .createPattern ( image , "repeat \| repeat-x \| repeat-y \| no-repeat");

Giá trị tham số

Parameter	Description	Play it
image	Specifies the image, canvas, or video element of the pattern to use
repeat	Default. The pattern repeats both horizontally and vertically
repeat-x	The pattern repeats only horizontally
repeat-y	The pattern repeats only vertically
no-repeat	The pattern will be displayed only once (no repeat)

❮ Tham chiếu HTML Canvas