HTML-Leinwand addColorStop () -Methode
Beispiele
Definieren Sie einen Farbverlauf von Schwarz nach Weiß, ein Rechteck Füllstil:
JavaScript:
var ctx=c.getContext('2d');
var grd=ctx.createLinearGradient(0,0,170,0);
grd.addColorStop(0,"black");
grd.addColorStop(1,"white");
ctx.fillStyle=grd;
ctx.fillRect(20,20,150,100);
Versuchen »
Browser-Unterstützung
Internet Explorer 9, Firefox, Opera, Chrome und Safari Unterstützung addColorStop () -Methode.
Hinweis: 8 und frühere Versionen von Internet Explorer unterstützt nicht das <canvas> -Element.
Definition und Verwendung
addColorStop () -Methode gibt die Steigung Objektfarbe und Position.
addColorStop () -Methode createLinearGradient () oder createRadialGradient () verwendet , zusammen.
Hinweis: Sie können anrufen addColorStop () -Methode mehrmals den Gradienten zu ändern.Wenn Sie nicht ein Gradient Objekt sind, mit dieser Methode wird die Steigung nicht sichtbar sein. Um sichtbar Gradienten zu erhalten, müssen Sie mindestens eine Farbe zu erzeugen.
| JavaScript-Syntax: | Gradient.addColorStop (Stopp, Farbe); |
|---|
Parameter Wert
| 参数 | 描述 |
|---|---|
| stop | 介于 0.0 与 1.0 之间的值，表示渐变中开始与结束之间的位置。 |
| color | 在stop位置显示的 CSS 颜色值 。 |
Weitere Beispiele
Beispiele
Es wird durch eine Mehrzahl von Gradienten addColorStop () Methode definiert:
JavaScript:
var ctx=c.getContext("2d");
var grd=ctx.createLinearGradient(0,0,170,0);
grd.addColorStop(0,"black");
grd.addColorStop("0.3","magenta");
grd.addColorStop("0.5","blue");
grd.addColorStop("0.6","green");
grd.addColorStop("0.8","yellow");
grd.addColorStop(1,"red");
ctx.fillStyle=grd;
ctx.fillRect(20,20,150,100);
Versuchen »