CanvasContext.fill

2021-07-06 11:36

Fill the current path. The default color is black.

If current path is not closed, fill() will connect the start point and end point and then fill.

The path that fill() covers is started from beginPath(), but does not cover that fillRect() covers.

Sample Code

copy

//.js
const ctx = my.createCanvasContext('awesomeCanvas')
ctx.moveTo(20, 20)
ctx.lineTo(200, 20)
ctx.lineTo(200, 200)
ctx.fill()
ctx.draw()

copy

//.js
const ctx = my.createCanvasContext('awesomeCanvas')
ctx.rect(20, 20, 110, 40)
ctx.setFillStyle('blue')
ctx.fill()

ctx.beginPath()
ctx.rect(20, 30, 150, 40)

ctx.setFillStyle('yellow')
ctx.fillRect(20, 80, 150, 40)

ctx.rect(20, 150, 150, 40)

ctx.setFillStyle('red')
ctx.fill()
ctx.draw()