HTML canvas clip() Metode
Voorbeeld
Knip van 'n reghoekige gebied van 200*120 pixels vanaf die doek. Teken dan 'n rooi reghoek. Slegs die deel van die rooi reghoek wat binne die geknipte area is, is sigbaar:
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);
Blaaierondersteuning
Die nommers in die tabel spesifiseer die eerste blaaierweergawe wat die metode ten volle ondersteun.
Method | |||||
---|---|---|---|---|---|
clip() | Yes | 9.0 | Yes | Yes | Yes |
Definisie en gebruik
Die clip()-metode knip 'n streek van enige vorm en grootte van die oorspronklike doek af.
Wenk: Sodra 'n streek geknip is, sal alle toekomstige tekeninge beperk word tot die geknipte streek (geen toegang tot ander streke op die doek nie). U kan egter die huidige doekstreek stoor deur die save() metode te gebruik voordat u die clip() metode gebruik, en dit herstel (met die restore() metode) enige tyd in die toekoms.
JavaScript-sintaksis: | konteks .clip(); |
---|
❮ HTML-doekverwysing