HTML 캔버스 클립 () 메소드
예
사각형 영역을 캔버스에서 200 * 120 픽셀을 잘라. 그런 다음, 빨간색 사각형을 그립니다. 만 빨간색 사각형 부분은 지역에서 볼 수 있습니다 절단 :
자바 스크립트 :
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>
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>
»시도
브라우저 지원
인터넷 익스플로러 9, 파이어 폭스, 오페라, 크롬과 사파리 지원 클립 () 메소드.
참고 : 인터넷 익스플로러 8 이전 버전의 <캔버스> 요소를 지원하지 않습니다.
정의 및 사용
클립 () 메소드는 원래 캔버스에서 모든 모양과 크기를 잘라.
팁 : 특정 영역을 절단되면, 이후의 모든 도면 영역으로 제한됩니다 절단되는 (캔버스에 다른 영역에 액세스하지 않음). 또한 미래에 언제든지 (기준 () 메소드 복원) (가) 막아 사용하여 저장된 현재 캔버스 영역 () 메소드 전에 클립 () 메소드를 사용하여 복구 할 수 있습니다.
| 자바 스크립트 구문 : | 컨텍스트 .clip (); |
|---|
HTML 캔버스 참조 설명서