CanvasGradient.addColorStop()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
La méthode CanvasGradient.addColorStop () ajoute un nouvel arrêt, défini par un décalage
et une couleur
, au dégradé. Si le décalage n'est pas compris entre 0 et 1, une erreur INDEX_SIZE_ERR est générée, si la couleur ne peut pas être analysée en tant que <color>
CSS, une erreur SYNTAX_ERR est générée.
Syntaxe
void gradient.addColorStop(décalage, couleur);
Paramètres
Exemples
Utilisation de la méthode addColorStop
Il s'agit seulement d'un simple fragment de code qui utilise la méthode addColorStop
avec un objet CanvasGradient
.
HTML
<canvas id="canevas"></canvas>
JavaScript
var canevas = document.getElementById("canevas");
var ctx = canevas.getContext("2d");
var degrade = ctx.createLinearGradient(0, 0, 200, 0);
degrade.addColorStop(0, "green");
degrade.addColorStop(1, "white");
ctx.fillStyle = degrade;
ctx.fillRect(10, 10, 200, 100);
Modifiez le code ci-dessous et voyez vos modifications mises à jour en direct dans le canevas :
Code jouable
Spécifications
Specification |
---|
HTML Standard # dom-canvasgradient-addcolorstop-dev |
Compatibilité des navigateurs
BCD tables only load in the browser
Voir aussi
- L'interface ladéfinissant,
CanvasGradient
CanvasRenderingContext2D.createLinearGradient()
CanvasRenderingContext2D.createRadialGradient()