Gambar untuk digunakan:
Contoh
Mengulang gambar secara horisontal dan vertikal:
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(); Cobalah sendiri " Dukungan Browser
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.
| metode | |||||
|---|---|---|---|---|---|
| createPattern() | iya nih | 9.0 | iya nih | iya nih | iya nih |
Definisi dan Penggunaan
The createPattern() metode mengulangi elemen tertentu dalam arah tertentu.
Elemen dapat gambar, video, atau lain <canvas> elemen.
elemen diulang bisa digunakan untuk menggambar / mengisi persegi panjang, lingkaran, garis dll
| sintaks JavaScript: | context.createPattern(image,"repeat|repeat-x|repeat-y|no-repeat"); |
|---|
Nilai parameter
| Parameter | Deskripsi | Mainkan |
|---|---|---|
| image | Menentukan gambar, kanvas, atau elemen video dari pola menggunakan | |
| repeat | Default. Pola mengulang secara horisontal dan vertikal | Mainkan " |
| repeat-x | Pola mengulang hanya secara horizontal | Mainkan " |
| repeat-y | Pola mengulang hanya secara vertikal | Mainkan " |
| no-repeat | Pola akan ditampilkan hanya sekali (tidak ada pengulangan) | Mainkan " |