畫布globalAlpha不會影響圖像？

Question

我試圖用putImageData（）在畫布上放置一系列圖像，但上下文的globalAlpha屬性似乎沒有效果。但是，它使用drawImage（）。這是它應該如何工作？

片斷代碼不起作用：

cx.globalAlpha = 0.1; 
cx.putImageData(imagesData[index], 0, 0); 

Answer 1

沒有，putImageData地方純淨，質樸從爲imageData像素，覆蓋任何像素在那裏。

從規格：

電流路徑，變換矩陣，陰影屬性，全局α，剪切區域，和全局合成操作員必須不影響getImageData()和putImageData()方法。

Answer 2

您可以使圖像成爲圖案，繪製路徑並填充它。

var img=document.getElementById("myImg") 
var c=document.getElementById("myCanvas"); 
var ctx=c.getContext("2d"); 
var pat=ctx.createPattern(img,'repeat'); 

ctx.globalAlpha=0.2; 

ctx.fillStyle=pat; 
ctx.beginPath(); ctx.rect(0,0,175,150); ctx.fill(); ctx.closePath(); 

ctx.globalAlpha=0.9; 

ctx.beginPath(); ctx.rect(50,50,75,50); ctx.fill(); ctx.closePath();