May 19, 2021 WeChat Mini Program Development Document
Drawing interfaces and methods
Create a circular gradient color.
Tip : Starts at the center of the circle and ends at the ring.
Tip:
You need
addColorStop()
to specify a gradient point, at least two.
Parameters | Type | Defined |
---|---|---|
Ⅹ | Number | The x coordinates of the center of the circle |
Y | Number | The y coordinates of the center of the circle |
R | Number | The radius of the circle |
const ctx = wx.createCanvasContext('myCanvas')
// Create circular gradient
const grd = ctx.createCircularGradient(75, 50, 50)
grd.addColorStop(0, 'red')
grd.addColorStop(1, 'white')
// Fill with gradient
ctx.setFillStyle(grd)
ctx.fillRect(10, 10, 150, 80)
ctx.draw()