From c05efa8d7ae464235cf83d7c0956e42dc6974103 Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:14 +0200 Subject: move *.html to *.md --- .../canvasrenderingcontext2d/clearrect/index.html | 141 --------------------- .../canvasrenderingcontext2d/clearrect/index.md | 141 +++++++++++++++++++++ 2 files changed, 141 insertions(+), 141 deletions(-) delete mode 100644 files/fr/web/api/canvasrenderingcontext2d/clearrect/index.html create mode 100644 files/fr/web/api/canvasrenderingcontext2d/clearrect/index.md (limited to 'files/fr/web/api/canvasrenderingcontext2d/clearrect') diff --git a/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.html b/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.html deleted file mode 100644 index 7bf854557e..0000000000 --- a/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.html +++ /dev/null @@ -1,141 +0,0 @@ ---- -title: CanvasRenderingContext2D.clearRect() -slug: Web/API/CanvasRenderingContext2D/clearRect -tags: - - API - - Canvas - - CanvasRendering2D - - Méthode - - Reference -translation_of: Web/API/CanvasRenderingContext2D/clearRect ---- -
{{APIRef}}
- -

La méthode CanvasRenderingContext2D.clearRect() de l'API 2D des Canvas met en noir transparent tous les pixels dans le rectangle défini par le point de départ de coordonnées (x, y) et par les tailles (largeur, hauteur), supprimant tout contenu précédemment dessiné.

- -

Syntaxe

- -
void ctx.clearRect(x, y, largeur, hauteur);
-
- -

Paramètres

- -
-
x
-
La coordonnée sur l'axe des x du point de départ du rectangle.
-
y
-
La coordonnée sur l'axe des y du point de départ du rectangle.
-
largeur
-
La largeur du rectangle.
-
hauteur
-
La hauteur de rectangle.
-
- -

Notes d'utilisation

- -

Un problème classique avec clearRect est qu'il peut apparaître comme ne fonctionnant pas si l'on n'utilise pas les trajets de façon appropriée. N'oubliez pas d'appeler {{domxref("CanvasRenderingContext2D.beginPath", "beginPath()")}} avant de commencer à dessiner une nouvelle image après avoir appelé clearRect.

- -

Exemples

- -

Utilisation de la méthode clearRect

- -

Ceci est seulement un fragment de code simple qui utilise la méthode clearRect.

- -

HTML

- -
<canvas id="canvas"></canvas>
-
- -

JavaScript

- -
var canevas = document.getElementById("canvas");
-var ctx = canevas.getContext("2d");
-
-ctx.beginPath();
-ctx.moveTo(20,20);
-ctx.lineTo(200,20);
-ctx.lineTo(120,120);
-ctx.closePath(); // dessine la dernière ligne du triangle
-ctx.stroke();
-
-ctx.clearRect(10, 10, 100, 100);
-
-// effacer le canevas entièrement
-// ctx.clearRect(0, 0, canvas.width, canvas.height);
-
- -

Modifiez le code suivant et voyez vos changements en direct dans le canevas :

- -

Code jouable

- - - - - -

{{ EmbedLiveSample('code_jouable', 700, 400) }}

- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-clearrect", "CanvasRenderingContext2D.clearRect")}}{{Spec2('HTML WHATWG')}} 
- -

Compatibilité des navigateurs

- -

{{Compat("api.CanvasRenderingContext2D.clearRect")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.md b/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.md new file mode 100644 index 0000000000..7bf854557e --- /dev/null +++ b/files/fr/web/api/canvasrenderingcontext2d/clearrect/index.md @@ -0,0 +1,141 @@ +--- +title: CanvasRenderingContext2D.clearRect() +slug: Web/API/CanvasRenderingContext2D/clearRect +tags: + - API + - Canvas + - CanvasRendering2D + - Méthode + - Reference +translation_of: Web/API/CanvasRenderingContext2D/clearRect +--- +
{{APIRef}}
+ +

La méthode CanvasRenderingContext2D.clearRect() de l'API 2D des Canvas met en noir transparent tous les pixels dans le rectangle défini par le point de départ de coordonnées (x, y) et par les tailles (largeur, hauteur), supprimant tout contenu précédemment dessiné.

+ +

Syntaxe

+ +
void ctx.clearRect(x, y, largeur, hauteur);
+
+ +

Paramètres

+ +
+
x
+
La coordonnée sur l'axe des x du point de départ du rectangle.
+
y
+
La coordonnée sur l'axe des y du point de départ du rectangle.
+
largeur
+
La largeur du rectangle.
+
hauteur
+
La hauteur de rectangle.
+
+ +

Notes d'utilisation

+ +

Un problème classique avec clearRect est qu'il peut apparaître comme ne fonctionnant pas si l'on n'utilise pas les trajets de façon appropriée. N'oubliez pas d'appeler {{domxref("CanvasRenderingContext2D.beginPath", "beginPath()")}} avant de commencer à dessiner une nouvelle image après avoir appelé clearRect.

+ +

Exemples

+ +

Utilisation de la méthode clearRect

+ +

Ceci est seulement un fragment de code simple qui utilise la méthode clearRect.

+ +

HTML

+ +
<canvas id="canvas"></canvas>
+
+ +

JavaScript

+ +
var canevas = document.getElementById("canvas");
+var ctx = canevas.getContext("2d");
+
+ctx.beginPath();
+ctx.moveTo(20,20);
+ctx.lineTo(200,20);
+ctx.lineTo(120,120);
+ctx.closePath(); // dessine la dernière ligne du triangle
+ctx.stroke();
+
+ctx.clearRect(10, 10, 100, 100);
+
+// effacer le canevas entièrement
+// ctx.clearRect(0, 0, canvas.width, canvas.height);
+
+ +

Modifiez le code suivant et voyez vos changements en direct dans le canevas :

+ +

Code jouable

+ + + + + +

{{ EmbedLiveSample('code_jouable', 700, 400) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-clearrect", "CanvasRenderingContext2D.clearRect")}}{{Spec2('HTML WHATWG')}} 
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.CanvasRenderingContext2D.clearRect")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf