CanvasContext.closePath

2020-09-14 15:16 更新

簡(jiǎn)介

CanvasContext.closePath 用于關(guān)閉一個(gè)路徑。關(guān)閉路徑會(huì)連接起點(diǎn)和終點(diǎn)。如果關(guān)閉路徑后沒(méi)有調(diào)用 fill() 或者 stroke() 并開(kāi)啟了新的路徑,那之前的路徑將不會(huì)被渲染。

掃碼體驗(yàn)

undefined

效果示例

畫布.gif

示例代碼

示例代碼 1

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

顯示效果如下圖所示: ctx.closepath.png

示例代碼 2

//.js
const ctx = my.createCanvasContext('canvas')
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()

顯示效果如下圖所示: ctx.clseopath2.png

以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)