JavaScript-如何添加两个图像的alpha，使结果为alpha=1？

我需要在两个图像之间进行转换-两个图像都是隐藏精灵吼叫的面具。每个遮罩的一部分是白色的，另一部分是透明的。我需要两个图像的总alpha每次都为1，这样看起来就像遮罩平滑地改变其形状。 如果我对image1使用从1到0的alpha转换，对image2使用从0到1的alpha转换，然后将两个图像相互覆盖，那么结果不是alpha1+alpha2=1。有没有办法得到它？ 谢谢，

---

Vaclav

我认为这是画布的默认行为，前提是目标是原始图像1（不是从1到0乘以alpha）

source over

操作执行

result=alpha*source+（1-alpha）*dest

，即使对于alpha通道也是如此

我没有掩码图像来测试它，但我认为这段代码应该满足您的要求：

ctx.globalCompositeOperation = 'copy';
ctx.globalAlpha = 1.;
ctx.drawImage(img1, 0, 0);
ctx.globalCompositeOperation = 'source-over';
ctx.globalAlpha = ratio;
ctx.drawImage(img2, 0, 0);

（如果您知道上下文在计算之前处于何种状态，则某些行是不必要的）

---

（顺便说一句，请给出一个示例代码来重现您问题中的问题，我们将不胜感激）