我找到了一个漂亮的JavaScript库，允许＆＃34;硬件加速＆＃34;画布2d画图：https://github.com/corbanbrook/webgl-2d
我尝试了这个例子，第一帧渲染就像它应该的那样，但是在第一帧之后，画布是白色的。
我在这里设置了一个小提琴：http://jsfiddle.net/RaW5x/5/
我必须假设它是库，因为这是来自存储库的示例。
答案 0 :(得分：4)
简短回答：我认为这不是图书馆的错误，但这绝对是图书馆应该解决的问题。
具体来说，webgl-2d sets the GL color mask during initialization使用gl.colorMask(1, 1, 1, 0) - 因此阻止了对Alpha通道的任何写入。
现在，我必须承认，我并不完全确定将屏幕变白的情况。混合函数是（src alpha，一个减去src alpha），这意味着对于写出的每种颜色，它将根据源alpha分量与背景颜色混合。为了简化说明，这里只是红色通道的公式：
Red = Rs * As + Rd * (1 - As)
...其中Rs是源（新）红色通道，As是源Alpha通道，Rd是目标（当前背景）红色通道。
所以，如果我们假设红色为50（或者在WebGL中为~0.196），我的理解是应该正在发生的是：
Red = 0.196 * 1 + 0.196 * (1 - 1) = 0.196
换句话说，它应该用新的颜色替换以前的颜色。
只要源通道等于目标通道，即使涉及1.0以外的alpha，数字也会改变一点，但结果不会改变：
Red = 0.196 * 0.5 + 0.196 * (1 - 0.5) = 0.196
如果目标红色通道实际上与源通道不同，结果会明显改变，但即便如此，我也看不到它是如何工作的白色。如果问题仅仅是由于混合问题，我预计会根据Alpha通道中的值向白色逐步增加，而不是在单个帧中“跳转”为白色。
在数学上，它看起来很好。但是，我可以通过设置颜色掩码以防止alpha写入在我自己的WebGL框架（Jax）中重现此问题，因此它不完全是库的错误。我猜这可能是你和我（以及无数其他）机器上的OpenGL驱动程序中的错误。
我将继续研究这个问题，如果我能学到任何东西，请更新这个答案。
无论如何，可以在 webgl-2d 库中解决该问题。我有submitted a pull request给开发者。 （仅供参考，您在问题中链接的回购是来自原始存储库的分支;我无法分辨当前维护者是谁，因此我将拉取请求发送到原始存储库。）
直到拉出请求（希望）被接受，或者问题得到解决，我相信你可以这样做：
ctxGL.colorMask(1, 1, 1, 1);
...在进行任何渲染之前，它应该只是工作。