多次调用WebGL drawElements会导致渲染错误

Question

我的问题是：为什么相同的示例WebGL代码会在不同的平台/浏览器上产生不同的输出？

在Windows上的Firefox 30.0（以及最新版本32）中，但在Mac上没有，在渲染点时，进行多次drawElements调用会导致渲染错误：

左上角：Firefox（不正确）。 右上方：Chrome（正确）。

我通过复制和调整以下示例代码重新创建了这个问题（首次遇到我无法分享的软件项目）：

https://developer.mozilla.org/samples/webgl/sample5/index.html

然后我修改了示例代码以获得最大的简单性，删除所有动画，渲染三个点而不是一个立方体，三次调用drawElements，为每个调整改变颜色。

  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, cubeVerticesIndexBuffer);
  setMatrixUniforms();
  gl.uniform4f(colorUniformLoc,1.0,0.0,0.0,1.0);
  /*****
  gl.drawElements(gl.POINTS, 36, gl.UNSIGNED_SHORT, 0); //commented out, from original example.
  *****/
  gl.drawElements(gl.POINTS, 1, gl.UNSIGNED_SHORT, 0);
  gl.uniform4f(colorUniformLoc,1.0,1.0,0.0,1.0);
  gl.drawElements(gl.POINTS, 1, gl.UNSIGNED_SHORT, 2);
  gl.uniform4f(colorUniformLoc,0.0,0.0,1.0,1.0);
  gl.drawElements(gl.POINTS, 1, gl.UNSIGNED_SHORT, 4);

渲染的三个点应该是一条直线：

var vertices = [
// Front face
-1.0, -1.0,  1.0,
-1.5, -1.0,  1.0,
-2.0, -1.0,  1.0, //more verts not shown...

我已经通过公共google-drive文件夹分享了完整的来源，感谢他们非常乐于助人：

https://drive.google.com/folderview?id=0B5OXnggcG9_7VlZHY003UzFYNGc&usp=sharing

可悲的是，Firefox 30是我们客户使用的（不可协商的）平台，因此通过更改浏览器无法轻松解决。

感谢您阅读！

Answer 1

This seems to be a bug in firefox。我猜没有简单的解决方法，除了在使用Firefox时不使用gl.drawElements中的偏移量。 :(问题可能仅在于POINTS，因此您可以使用四边形作为另一种解决方案来绘制点。