CanvasGradient：addColorStop() 方法
注意：此功能在 Web Workers 中可用。
CanvasGradient.addColorStop() 方法為給定的畫布漸變新增一個由 offset（偏移量）和 color（顏色）定義的新顏色停止點。
語法
js
addColorStop(offset, color)
引數
返回值
無（undefined）。
異常
IndexSizeErrorDOMException-
如果
offset不在 0 和 1 之間（包含這兩個值），則丟擲異常。 SyntaxErrorDOMException-
如果
color無法被解析為 CSS<color>值，則丟擲異常。
示例
為漸變新增停止點
此示例使用 addColorStop 方法為線性 CanvasGradient 物件新增停止點。然後使用該漸變填充矩形。
HTML
html
<canvas id="canvas"></canvas>
JavaScript
js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
let gradient = ctx.createLinearGradient(0, 0, 200, 0);
gradient.addColorStop(0, "green");
gradient.addColorStop(0.7, "white");
gradient.addColorStop(1, "pink");
ctx.fillStyle = gradient;
ctx.fillRect(10, 10, 200, 100);
結果
規範
| 規範 |
|---|
| HTML # dom-canvasgradient-addcolorstop-dev |
瀏覽器相容性
載入中…