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

CanvasRenderingContext2D.reset()

[_] [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]

reset()

Przykłady:

<script>

 window.onload = () => {

 const szer = 600;
 const wys = 600;

 const canvas = document.getElementById("canvas");
 canvas.width = szer;
 canvas.height = wys; 
 const ctx = canvas.getContext("2d");
 
 function zadanieA() {

 ctx.lineWidth = 15;
 ctx.strokeRect(25, 25, 150, 150);

 }

 function zadanieB() {

 ctx.lineWidth = 15;
 ctx.beginPath();
 ctx.arc(100, 100, 75, 0, 2 * Math.PI);
 ctx.stroke();

 }

 zadanieA();

 let a = true;
 const przycisk = document.getElementById("przycisk-reset");

 przycisk.addEventListener("click", () => {

 ctx.reset();

 if (a) {
 zadanieB();
 } else {
 zadanieA();
 }
 a = !a;

 });

 return;

 };

</script>

<button id="przycisk-reset" style="display: block;">Start</button>
<canvas id="canvas" width="100" height="100"></canvas>

Opis:
Metoda CanvasRenderingContext2D.reset() resetuje kontekst renderowania do stanu domyślnego, umożliwiając jego ponowne wykorzystanie do rysowania czegoś innego bez konieczności jawnego resetowania wszystkich właściwości. Resetowanie czyści bufor zapasowy, stos stanu rysunku, wszelkie zdefiniowane ścieżki i style. Obejmuje to bieżącą macierz transformacji, właściwości kompozycji, region przycinania, listę myślników, style linii, style tekstu, cienie, wygładzanie obrazu, filtry itd.

Zobacz też: