可以在Canvas HTML5中将Alpha透明度填充或描边样式与RGB分开设置吗？

Question

在Canvas/HTML5中,我知道你可以使用RGBA为fillStyle或strokeStyle设置颜色和alpha透明度.您也可以仅使用RGB来设置没有Alpha通道的颜色.有没有办法可以更改项目的alpha值而不提供颜色.

我的例子是想要在颜色随机或不再知道的画布部分上方更改fillStyle或strokeStyle.有没有办法通过另一个属性更改alpha或通过不传递颜色(例如ctx.fillStyle ='rgba(,,, alphaValue)';)

Answer 1

有几种方法。

首先，globalAlpha上下文的属性。

正如您在标题中所问的那样，它将允许独立于填充或描边设置透明度。

然后，您可以使用getImageData某个点上的 找出颜色并保存该信息，使用clearRect、 设置清除该区域globalAlpha，然后使用保存的颜色重新绘制该区域。

当然，你globalAlpha根本不需要。您也可以执行上述操作，而不是设置全局 Alpha，只需修改您保存的颜色的 Alpha。

如果您想让画布的大而复杂的区域变得更加透明，那么您将需要更改 globalAlpha，然后使用 drawImage将画布绘制到其自身上。

这是一个例子。我绘制两个矩形，然后使它们之间的矩形区域更加透明。