Klip kanvas HTML () Metode
Contoh
Klip wilayah persegi panjang 200*120 piksel dari kanvas. Kemudian, menggambar persegi panjang merah. Hanya bagian persegi panjang merah yang ada di dalam area terpotong yang terlihat:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
// Clip a rectangular area
ctx.rect(50, 20, 200, 120);
ctx.stroke();
ctx.clip();
// Draw red rectangle after clip()
ctx.fillStyle = "red";
ctx.fillRect(0, 0, 150, 100);
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.
| Method | |||||
|---|---|---|---|---|---|
| clip() | Yes | 9.0 | Yes | Yes | Yes |
Definisi dan Penggunaan
Metode clip() memotong wilayah dalam bentuk dan ukuran apa pun dari kanvas asli.
Tip: Setelah suatu wilayah terpotong, semua gambar di masa mendatang akan dibatasi pada wilayah yang terpotong (tidak ada akses ke wilayah lain di kanvas). Namun Anda dapat menyimpan wilayah kanvas saat ini menggunakan metode save() sebelum menggunakan metode clip(), dan memulihkannya (dengan metode restore()) kapan saja di masa mendatang.
| Sintaks JavaScript: | konteks .klip(); |
|---|
Referensi Kanvas HTML