建设一个颜色的渐变点。。。。。。
Tip: 小于最小 stop 的部分会按最小 stop 的 color 来渲染,,,,大于最大 stop 的部分会按最大 stop 的 color 来渲染。。。。。。
Tip: 需要使用addColorStop()来指定渐变点,,,,至少要两个。。。。。。
| 参数 | 类型 | 界说 |
|---|---|---|
| stop | Number(0-1) | 体现渐变点在起点和终点中的位置 |
| color | Color | 渐变点的颜色 |
const ctx = wx.crateCanvasContext('myCanvas')
// Create circular gradient
const grd = ctx.createCircularGradient(30, 10, 120, 10)
grd.addColorStop(0, 'red')
grd.addColorStop(0.16, 'orange')
grd.addColorStop(0.33, 'yellow')
grd.addColorStop(0.5, 'green')
grd.addColorStop(0.66, 'cyan')
grd.addColorStop(0.83, 'blue')
grd.addColorStop(1, 'purple')
// Fill with gradient
ctx.setFillStyle(grd)
ctx.fillRect(10, 10, 150, 80)
ctx.draw()
更多微信小程序开发教程,,,,可以关注。。。。。。
KESION pp电子软件
KESION pp电子软件是海内领先的在线教育软件及私域社交电商软件服务提供商,,,,恒久专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。。。。。。
公司焦点产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化自力安排品牌网校和在线教育咨询等。。。。。。KESION 一直通过手艺立异,,,,提供产品和服务,,,,助力企业向数字化转型,,,,通过科技驱动商业刷新,,,,让商业变得更智慧!
绘图接口和要领 canvasContext.createCircularGradient 界说 建设一个圆形的渐变颜色。。。。。。 Tip : 起点在圆心,,,,终点在圆环。。。。。。 Tip : 需要使用 addColorS
绘图接口和要领 canvasContext.setLineWidth 界说 设置线条的宽度。。。。。。 参数 参数 类型 说明 lineWidth Number 线条的宽度(单位是px) 例子 const ct