clearRect 메서드

clearRect 메서드는 지우개처럼 작동하여 사각형 영역을 지워 내용을 완전히 투명하게 만듭니다.

구문

javascript컨텍스트.clearRect(x, y, 너비, 높이);

예제

fillRect로 사각형을 그리고 clearRect로 일부를 지워봅시다:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.fillRect(50, 50, 100, 100);
ctx.clearRect(75, 75, 50, 50);

Результат:

함께 보기