Javascript - 畫布 - 在previousley上填充透明png填充顏色

Question

如果我在畫布上繪製矩形，請用純色填充。是否可以用透明png重新填充它，這樣我仍然可以在背景中看到原始顏色？

喜歡的東西，以虛設碼 -

ctx.beginPath(); 
    ctx.lineTo(//draw a rectangle) 
    ctx.fillStyle = "#FF0000" 
    ctx.fill(); 
    var imageObj = new Image(); 
    function drawPattern() { 
     var pattern = ctx.createPattern(imageObj, "repeat"); 
     ctx.fillStyle = pattern; 
     ctx.fill(); 
    } 
    imageObj.onload = drawPattern; 
    imageObj.src = "images/dot.png"; //transparent png 

我已經嘗試了類似的方法，它不工作。

是否有另一種方法呢？我錯過了什麼嗎？

Answer 1

你有什麼會工作得很好。確保你有一個真正透明的PNG。

這是你的代碼的工作示例：

http://jsfiddle.net/BDXc7/