Método de clipe de tela HTML ()
Exemplo
Clipe de uma região retangular de 200*120 pixels da tela. Em seguida, desenhe um retângulo vermelho. Apenas a parte do retângulo vermelho que está dentro da área cortada é visível:
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);
Suporte ao navegador
Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao método.
| Method | |||||
|---|---|---|---|---|---|
| clip() | Yes | 9.0 | Yes | Yes | Yes |
Definição e uso
O método clip() recorta uma região de qualquer forma e tamanho da tela original.
Dica: Depois que uma região for recortada, todos os desenhos futuros serão limitados à região recortada (sem acesso a outras regiões na tela). No entanto, você pode salvar a região da tela atual usando o método save() antes de usar o método clip() e restaurá-la (com o método restore()) a qualquer momento no futuro.
| Sintaxe JavaScript: | contexto .clip(); |
|---|
❮ Referência de tela HTML