CanvasContext.createLinearGradient

简介

CanvasContext.createLinearGradient 用于创建一个线性的渐变色。需要使用 addColorStop() 来指定渐变点，至少需要两个渐变点。

扫码体验

undefined

效果示例

画布.gif

示例代码

//.js
const ctx = my.createCanvasContext('canvas')


const grd = ctx.createLinearGradient(10, 10, 150, 10)
grd.addColorStop(0, 'yellow')
grd.addColorStop(1, 'blue')


ctx.setFillStyle(grd)
ctx.fillRect(20, 20, 250, 180)
ctx.draw()

显示效果如下图所示： ctx.lineargradient.png

入参

Object 类型，属性如下：

属性	类型	描述
x0	Number	起点 x 坐标。
y0	Number	起点 y 坐标。
x1	Number	终点 x 坐标。
y1	Number	终点 y 坐标。