WebGL在某些设备上无法渲染纹理。

Question

WebGL在某些设备上无法渲染纹理。

javascriptcanvasrenderingwebglgalaxy-tab

3

我正在探索WebGL在游戏中的功能，并正在各种设备上进行测试。目前我正在使用Turbulenz Engine，它为我处理了所有渲染等操作。

然而，在我测试过的一些移动和平板设备上（例如三星Galaxy和三星Galaxy Tab II），纹理没有被正确地渲染。它们要么不显示，要么变成黑色或空白颜色。

我的设备设置如下：

- 三星Galaxy S / 三星Galaxy Tab II - Android 2.3（姜饼）, Android 4.2（果冻豆） - 启用WebGL的Google Chrome Beta - Turbulenz旋转箱示例请看我制作的这张截图：

enter image description here

我做了一些研究，发现这个页面描述了完全相同的问题。不幸的是，没有提供为什么会出现这个问题以及解决方案的好的解释。

您对这些“旧”设备上的这个主题有任何经验吗？为什么会出现这个问题？我在某个地方读到过，操作系统在加载纹理时会对其进行缩放，这可能是原因吗？那么如何避免呢？

提前感谢您！

- Eric

你尝试过远程调试移动版Chrome，看看控制台是否提供了有用的提示来解决问题吗？https://developers.google.com/chrome-developer-tools/docs/remote-debugging - Anton

是的，我已经尝试过了，它会输出一些关于WebGL的错误：https://lh6.googleusercontent.com/-45B9-lPMRnc/UtBjH2BGNYI/AAAAAAAAAIY/7QvxiD1Q71Q/s1600/error2.png。似乎加载图像会破坏POT维度或其他什么东西。 - Eric

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- gman · Accepted Answer

错误提示

bindAttribLocation: index out of range

建议是代码试图使用太多的属性。要找出GPU支持多少个属性，可以调用以下函数：

maxAttributes = gl.getParameter(gl.MAX_VERTEX_ATTRIBS);

WebGL实现必须支持最小值为8。

bindAttribLocation的错误意味着代码使用了一个大于等于maxAttributes的值来调用bindAttribLocation。

这有点令人惊讶，因为对于大多数常见的3D应用程序，它们会有位置、法线、纹理坐标，然后可能是切线、副法线、顶点颜色。这只有6个属性。第二或第三组纹理坐标并不罕见，但超过这个数量似乎相当少见。尽管如此，这就是错误信息所暗示的。

只是为了好玩，我查看了Score Rush，这是一款turbulenz游戏。它正在使用属性0、3和8。为什么不是0、1和2我不知道，但在任何只支持最小8个属性的设备上，尝试使用属性8都将失败，因为7是最高属性。

更新：我查看了turbulenz的源代码。按照当前的设计，它需要16个属性。它给每个属性0到15分配了特定的用途。例如，第一组纹理坐标始终放在属性8上。（这就是你看到纹理消失的原因）。第一组切线始终放在属性14上。等等。以下是分配清单：

SEMANTIC_POSITION = 0;
SEMANTIC_POSITION0 = 0;
SEMANTIC_BLENDWEIGHT = 1;
SEMANTIC_BLENDWEIGHT0 = 1;
SEMANTIC_NORMAL = 2;
SEMANTIC_NORMAL0 = 2;
SEMANTIC_COLOR = 3;
SEMANTIC_COLOR0 = 3;
SEMANTIC_COLOR1 = 4;
SEMANTIC_SPECULAR = 4;
SEMANTIC_FOGCOORD = 5;
SEMANTIC_TESSFACTOR = 5;
SEMANTIC_PSIZE0 = 6;
SEMANTIC_BLENDINDICES = 7;
SEMANTIC_BLENDINDICES0 = 7;
SEMANTIC_TEXCOORD = 8;
SEMANTIC_TEXCOORD0 = 8;
SEMANTIC_TEXCOORD1 = 9;
SEMANTIC_TEXCOORD2 = 10;
SEMANTIC_TEXCOORD3 = 11;
SEMANTIC_TEXCOORD4 = 12;
SEMANTIC_TEXCOORD5 = 13;
SEMANTIC_TEXCOORD6 = 14;
SEMANTIC_TEXCOORD7 = 15;
SEMANTIC_TANGENT = 14;
SEMANTIC_TANGENT0 = 14;
SEMANTIC_BINORMAL0 = 15;
SEMANTIC_BINORMAL = 15;

需要一定的重新设计或间接方式才能使其在具有少于16个属性的GPU上工作。