Los últimos tutoriales de desarrollo web
 

HTML canvas clip() Method

<Objeto Canvas

Ejemplo

Clip de una región rectangular de 200 x 120 píxeles desde el lienzo. A continuación, dibuje un rectángulo rojo. Sólo la parte del rectángulo de color rojo que se encuentra dentro del área recortada es visible:

YourbrowserdoesnotsupporttheHTML5canvastag.

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>
Inténtalo tú mismo "

Soporte del navegador

Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el método.

Método
clip() 4.0 9.0 3.6 4.0 10.1

Definición y Uso

Los clip() clips método una región de cualquier forma y tamaño de la tela original.

Tip: Una vez que se recorta una región, todo el dibujo futuro será limitada a la región recortada (no access to other regions on the canvas) . Sin embargo, puede salvar a la región de la lona actual utilizando el save() método antes de utilizar la clip() método, y restaurarla (with the restore() método) en cualquier momento en el futuro.

la sintaxis de JavaScript: context . clip() ;

<Objeto Canvas