Méthode clearRect()
Exemple
Effacer un rectangle sur le canevas :
JavaScript :
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.fillStyle = "red";
ctx.fillRect(20, 20, 200, 100);
ctx.clearRect(40, 40, 50, 50); Description
La méthode clearRect() efface les pixels spécifiés sur le canevas.
La méthode clearRect() ne modifie pas le chemin actuel.
La zone effacée est définie comme transparente rgba(0,0,0,0).
Remarque
Appelez toujours beginPath() avant de dessiner après avoir utilisé clearRect() .
Voir aussi :
La propriété fillStyle (Définir une couleur ou un motif de remplissage)
La méthode fillRect() (Dessiner un rectangle rempli)
La méthode strokeRect() (Dessiner un rectangle)
La méthode rect() (Ajouter un rectangle au chemin)
Syntaxe
| context .clearRect( x, y, width, height ) |
Valeurs des paramètres
| Paramètre | Description | Jouez-le |
|---|---|---|
| x | La coordonnée x du coin supérieur gauche du rectangle | |
| y | La coordonnée y du coin supérieur gauche du rectangle | |
| width | La largeur du rectangle à effacer en pixels | |
| height | La hauteur du rectangle à effacer en pixels |
Valeur de retour
| AUCUN |
Support des navigateurs
L'élément <canvas> est une norme HTML5 (2014).
clearRect() est pris en charge par tous les navigateurs modernes :
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Oui | Oui | Oui | Oui | Oui | 9-11 |