HTML canvas clip() Metodo

❮ Riferimento tela HTML

Esempio

Clip di una regione rettangolare di 200*120 pixel dalla tela. Quindi, disegna un rettangolo rosso. È visibile solo la parte del rettangolo rosso che si trova all'interno dell'area ritagliata:

Il tuo browser non supporta il canvastag HTML5.

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

Supporto browser

I numeri nella tabella specificano la prima versione del browser che supporta completamente il metodo.

Method
clip() Yes 9.0 Yes Yes Yes

Definizione e utilizzo

Il metodo clip() ritaglia una regione di qualsiasi forma e dimensione dalla tela originale.

Suggerimento: una volta ritagliata una regione, tutti i disegni futuri saranno limitati alla regione ritagliata (nessun accesso ad altre regioni sulla tela). È tuttavia possibile salvare la regione corrente della tela utilizzando il metodo save() prima di utilizzare il metodo clip() e ripristinarla (con il metodo restore()) in qualsiasi momento in futuro.

sintassi JavaScript: contesto .clip();

❮ Riferimento tela HTML