[ Leksykon ] [ JavaScript ] [ Metody ] [ Właściwości ] [ canvas ] [ CanvasRenderingContext2D ]

CanvasRenderingContext2D.clearRect()

[_] [A] [B] [C] [D] [E] [F] [G] [H] [I] [J] [K] [L] [M] [N] [O] [P] [Q] [R] [S] [T] [U] [V] [W] [X] [Y] [Z]

clearRect(x, y, width, height)

Przykłady:

ctx.clearRect(0, 0, canvas.width, canvas.height);

<script>

 window.onload = () => {
 
 const szer = 600;
 const wys = 500;
 
 const canvas = document.getElementById("canvas");
 canvas.width = szer;
 canvas.height = wys; 
 const ctx = canvas.getContext("2d");
 
 ctx.beginPath();
 ctx.fillStyle = "#111";
 ctx.fillRect(0, 0, canvas.width, canvas.height);

 ctx.beginPath();
 ctx.fillStyle = "yellow";
 ctx.moveTo(120, 120);
 ctx.lineTo(380, 120);
 ctx.lineTo(230, 330);
 ctx.closePath();
 ctx.fill();

 ctx.clearRect(250, 50, 250, 300);

 };

</script>
 
<canvas id="canvas" width="1" height="1"></canvas>

Opis:
Metoda CanvasRenderingContext2D.clearRect() usuwa piksele z prostokątnego obszaru, ustawiając je na przezroczystą czerń. Metoda ta clearRect() ustawia piksele w prostokątnym obszarze na przezroczystą czerń rgba(0,0,0,0). Lewy górny róg prostokąta znajduje się w miejscu (x, y), a jego rozmiar jest określony przez width i height. Parametry x - współrzędna osi x punktu początkowego prostokąta, y - współrzędna osi Y punktu początkowego prostokąta, width - szerokość prostokąta. Wartości dodatnie znajdują się po prawej stronie, a ujemne po lewej stronie, height - wysokość prostokąta. Wartości dodatnie spadają, a ujemne rosną..

Zobacz też:
beginPath() - (canvas) Rozpoczyna nową ścieżkę