全部产品

CanvasContext.closePath

关闭一个路径。关闭路径会连接起点和终点。如果关闭路径后没有调用 fill() 或者 stroke() 并开启了新的路径,那之前的路径将不会被渲染。

示例代码

示例代码 1

//.js
const ctx = my.createCanvasContext('awesomeCanvas')
ctx.moveTo(20, 20)
ctx.lineTo(150, 20)
ctx.lineTo(150, 150)
ctx.closePath()
ctx.stroke()
ctx.draw()

显示效果如下图所示:

image

//.js
const ctx = my.createCanvasContext('awesomeCanvas')
ctx.rect(20, 20, 150, 50)
ctx.closePath()

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

ctx.setFillStyle('red')
ctx.fillRect(20, 80, 120, 30)

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

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

显示效果如下图所示:

image