Javascript HTML5画布颜色

我在HTML5画布中有两个块

蓝色块固定在画布上

可以用鼠标拖动的黄色块

当有人将黄色块移到蓝色块上时，我想将重叠或相交区域的颜色更改为绿色。（请参阅附图，以便有清晰的概念）

由于蓝色+黄色=绿色，有没有办法通过改变块的不透明度级别来实现这一点，或者我必须搜索两个块的重叠区域并在该区域显示绿色块，或者有其他方法

---

我想知道实现这一目标的最佳方法是什么？

看看。更轻的复合类型似乎适合您的需求。

您可以使用3种元素：

• 黄色底部：不透明度1
• 黄色顶部：不透明度0.x，与底部尺寸相同
• 蓝色：黄色div之间的完全不透明度

这远未实现，但可能是朝着正确方向迈出的一步

---

编辑：我注意到您在画布上请求它已经太晚了，但是那里的原则应该是相同的。

我认为您可以使用rgba颜色，并将每个颜色的不透明度级别指定为0.5。这应该能帮上忙，但我用你的技术没能达到预期的效果。