2014-10-10 81 views
0

我的问题是:为什么相同的示例WebGL代码导致不同平台/浏览器上的输出不同? enter image description here对WebGL drawElements的多次调用导致不正确的呈现

左上图:

在Firefox 30.0(和最新的一个,32)在Windows上,但Mac,使得多个drawElements渲染点的时候调用不正确的渲染结果火狐(不正确)。 右上: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... 

我已经通过共享的人谁感觉就像是极有帮助的公开谷歌驱动器文件夹的完整源代码:

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

可悲的是,火狐30是由我们的客户使用(不可转让)的平台,所以不容易解决,通过改变浏览器。

谢谢您的阅读!

回答

1

This seems to be a bug in firefox。我猜想没有简单的解决方法,除非在使用Firefox时不使用gl.drawElements中的偏移量。 :(这可能只是在POINTS的问题,所以你可以使用四边形绘制点而不是另一个解决方案。

+0

感谢您的快速回答,并感谢报告错误!我找不到任何看起来类似,当我搜索bugzilla之前,我会和我们的客户讨论升级到FF33 +,或者继续我的解决方法,这可能类似于使用多个顶点缓冲区,这样可以调用drawArrays而不是drawElements。 – Freya301 2014-10-11 15:12:09