Exemplo
Clipe de uma região retangular de 200*120 pixels da tela. Em seguida, desenhe um retângulo vermelho. Apenas a parte do rectângulo vermelho que está dentro da área recortada é 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);
</script>
Tente você mesmo " Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente o método.
Método | |||||
---|---|---|---|---|---|
clip() | sim | 9 | sim | sim | sim |
Definição e Uso
Os clip() clips Método A região de qualquer forma e tamanho da tela inicial.
Dica: Uma vez que uma região é cortada, todos os futuros desenho será limitada à região cortada (sem acesso a outras regiões na tela).No entanto, pode salvar a região da lona atual usando o save() método antes de usar o clip() método, e restaurá-lo (com a restore() método) qualquer momento no futuro.
sintaxe JavaScript: | context.clip(); |
---|