HTML canvas fill() Methode
Voorbeeld
Teken twee rechthoeken van 150 x 100 pixels. Vul de ene met een rode kleur en de andere met een blauwe kleur:
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();
Browserondersteuning
De getallen in de tabel geven de eerste browserversie aan die de methode volledig ondersteunt.
| Method | |||||
|---|---|---|---|---|---|
| fill() | Yes | 9.0 | Yes | Yes | Yes |
Definitie en gebruik
De methode fill() vult de huidige tekening (pad). De standaardkleur is zwart.
Tip: gebruik de eigenschap fillStyle om te vullen met een andere kleur/verloop.
Opmerking: Als het pad niet is gesloten, voegt de methode fill() een lijn toe vanaf het laatste punt naar het beginpunt van het pad om het pad te sluiten (zoals closePath() ), en vult vervolgens het pad.
| JavaScript-syntaxis: | context .fill(); |
|---|
❮ HTML Canvas-referentie