Méthode clearRect

La méthode clearRect fonctionne comme une gomme, en nettoyant une zone rectangulaire et en rendant son contenu complètement transparent.

Syntaxe

javascriptcontexte.clearRect(x, y, largeur, hauteur);

Exemple

Dessinons un carré avec fillRect et effaçons-en une partie avec 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);

Результат:

Voir aussi

  • la méthode fillRect,
    qui permet de dessiner un rectangle rempli