1. 首頁
  2. 問答
  3. html canvas：剪裁和文本

html canvas：剪裁和文本

2011-09-05 105 views
7

我正在使用canvas， 繪製應用程序，我想讓用戶選擇只在選定區域繪製的選項。 因爲我可以使用clip（）方法。 但如果我想讓用戶也能夠在裏面畫字母 - 有什麼辦法可以使用clip（）作爲文本嗎？ 有另一種方法可以做到嗎？html canvas：剪裁和文本

謝謝

來源

2011-09-05 Amit Hagin

+0

我的東西不能理解「但是如果我想讓用戶能夠在裏面畫字母也是」部分 –

回答

11

你可以做到這一點，但不能使用剪輯。剪輯僅適用於路徑，文本不是路徑。

您將需要使用第二個內存（不在頁面上）畫布以實現該效果。這裏是如何：

  1. 請在內存中的畫布上，將其設置爲寬度和高度可以包含文本
  2. 繪製文本到內存帆布
  3. 設置在內存方面的的globalCompositeOperation爲「源式」
  4. 繪製所需剪輯到文本
  5. 使用drawImage(in-memory-canvas, x, y)把新創建的影響到你的正常的畫布

來源

2011-09-05 22:00:06

+0

很好的答案！謝謝 –

+0

好吧，這有些問題。當我用小於100％的alpha顏色繪製「剪裁」文本時，我無法再用更高的alpha％顏色繪製相同的像素。 –

相關問題

 相關問題