WebGL 不渲染可能与警告有关

Question

我对 OpenGL 比较陌生，正在尝试学习一点 WebGl。我遇到了 a tutorial that, while great, appears to be a bit dated. I implemented my own version of this example in a Plunkr。我故意遗漏了正方形，但是，一旦我连接好所有东西，我就看不到三角形了。我在控制台中发现了一个警告...

WARNING: Attribute 0 is disabled. This has signficant performance penalty

还有另一个 SO question 看起来很相似，但通过差异查看我无法让它工作，我无法理解他所说的内容。这是我的绘图代码供参考...

drawScene() {
    this.gl.viewport(0, 0, this.gl.viewportWidth, this.gl.viewportHeight);
    this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
    mat4.perspective(45, this.gl.viewportWidth / this.gl.viewportHeight, 0.1, 100.0, this.pMatrix);
    mat4.identity(this.mvMatrix);
    mat4.translate(this.mvMatrix, this.mvMatrix, [-1.5, 0.0, -7.0]);
    this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.triangleVertexPositionBuffer);
    this.gl.vertexAttribPointer(this.shaderProgram.vertexPositionAttribute, this.triangleVertexPositionBuffer.itemSize, this.gl.FLOAT, false, 0, 0);
    this.setMatrixUniforms();
    this.gl.drawArrays(this.gl.TRIANGLES, 0, this.triangleVertexPositionBuffer.numItems);
  }

这里有没有人有经验可以帮助指导新手？

Answer 1

所以回顾 this link helped a lot. One thing to consider is it doesn't talk about the glUtils js file they import so yeah that is needed. It seems that what the warning message is referring to is the need in newer versions to be explicit about params for the shader. Here is an example plnkr 你会发现这是不同的...

// NEEDED to prevent warning
    this.vertexPositionAttribute = this.gl.getAttribLocation(this.shaderProgram, "aVertexPosition");
    this.gl.enableVertexAttribArray(this.vertexPositionAttribute);

当我以这种方式设置我的着色器属性时，我避免了警告！

WebGL 不渲染可能与警告有关

WebGL not rendering may be related to warning

webgl