Méthode HTML canvas fill()

❮ Référence de canevas HTML

Exemple

Dessinez deux rectangles de 150*100 pixels. Remplissez l'un avec une couleur rouge et l'autre avec une couleur bleue :

Votre navigateur ne prend pas en charge la balise HTML5 canva.

JavaScript :

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");

ctx.beginPath();
ctx.rect(20, 20, 150, 100);
ctx.fillStyle = "red";
ctx.fill();

ctx.beginPath();
ctx.rect(40, 40, 150, 100);
ctx.fillStyle = "blue";
ctx.fill();

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge la méthode.

Method
fill() Yes 9.0 Yes Yes Yes

Définition et utilisation

La méthode fill() remplit le dessin courant (chemin). La couleur par défaut est le noir.

Astuce : Utilisez la propriété fillStyle pour remplir avec une autre couleur/dégradé.

Remarque : Si le chemin n'est pas fermé, la méthode fill() ajoutera une ligne du dernier point au point de départ du chemin pour fermer le chemin (comme closePath() ), puis remplira le chemin.

Syntaxe JavaScript : contexte .fill();

❮ Référence de canevas HTML