2012-04-19 111 views
0

我正在用畫布開發繪圖應用程序。 我想實現一個擦除功能,但不是一個簡單的擦除,這是一個簡單的白色筆,一個真正的橡皮擦。畫布擦除不起作用

事實上,我在應用程序上添加了一個透明畫布,我想在繪製時可以清除我繪製的內容,即將不透明度設置爲0!

我已經在谷歌搜索&計算器,我發現:

代碼:JavaScript的 - Sélectionner

context.globalCompositeOperation = "destination-out"; 
context.strokeStyle = "rgba(0,0,0,0)"; 

但它不工作......太,我試着所示的globalCompositeOperation不同模式在MDN,但沒有區別。 請幫忙。

回答

2

它不起作用,因爲你在你想擦除的東西上繪製一條透明線......所以它什麼都不做。

當你有一個白色的背景時,很容易擦除,你只是畫白。但這不是你想要的。

這裏的訣竅是使用clearRect刪除畫布上的內容,而不是繪製其他形狀。

context.clearRect(cursorX, cursorY, brushWidth, brushHeight); 

它會顯示爲小方塊,但我不能看到另一種方式來做到這一點,除了可能與像素操縱。

+0

是的,這確實是我所做的愚蠢。我試試你的解決方案 – benenutz 2012-04-19 11:46:02

+0

將它標記爲已解決! – jazzytomato 2012-04-19 12:02:44

+0

最後,此代碼有效: context.globalCompositeOperation =「destination-out」; context.strokeStyle =「rgba(0,0,0,0)」; 但你必須改變一個參數,RGBA的最後一個,所以這條線是正確的2D背景: context.strokeStyle =「RGBA(0,0,0,1.0)」; 這很酷:) – benenutz 2012-04-19 12:55:04