WebGL blendFunc的bug还是误会？

Question

我正在尝试在黑色背景上绘制一个半透明的黑色三角形。

以下是我的示例：http://codewithoutborders.com/posted/blend.html

设置并启用blendFunc（第151行）：

gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
gl.enable(gl.BLEND);

缓冲区被清除为黑色（第129行）：

gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

着色器填充半透明黑色（第10行）：

gl_FragColor = vec4(0.0, 0.0, 0.0, .5);

我希望三角形是黑色的，因为文档说明了

result = {foreground}*sourceAlpha + {background}*(1-sourceAlpha)
       = (0,0,0,.5)*.5 + (0,0,0,1)*.5
       = (0,0,0,.75)

哪个是黑色的，对吧？

那么灰色来自哪里？

Answer 1

（有多尴尬。发帖后3分钟回答我自己的问题，但不是在重大脱发之前）

灰色来自HTML页面的白色背景，在通过其他黑色画布“打孔”3/4透明孔后显示出来。

添加

style="background:black;"

标签可以解决问题。

[gman的评论，下面，是一个更好的解决方案]