使用Canvas繪制圖像的時候，我們經常會想要只保留圖像的一部分，這是我們可以使用canvas API再帶的圖像裁剪功能來實現這一想法。
Canvas API的圖像裁剪功能是指，在畫布內使用路徑，只繪制該路徑內所包含區域的圖像，不會只路徑外的圖像。這有點像Flash中的圖層遮罩。

使用圖形上下文的不帶參數的clip()方法來實現Canvas的圖像裁剪功能。該方法使用路徑來對Canvas話不設置一個裁剪區域。因此，必須先創建好路徑。創建完整后，調用clip()方法來設置裁剪區域。
需要注意的是裁剪是對畫布進行的，裁切后的畫布不能恢復到原來的大小，也就是說畫布是越切越小的，要想保證最后仍然能在canvas最初定義的大小下繪圖需要注意save()和restore()。畫布是先裁切完了再進行繪圖。并不一定非要是圖片，路徑也可以放進去~

先來看看一個簡單的Demo。

發表評論 共有條評論 用戶名: 密碼: 驗證碼: 匿名發表