WebGL警告:“属性0被禁用。这具有显着的性能损失“ [英] WebGL warning: "Attribute 0 is disabled. This has significant performance penalty"

查看:633
本文介绍了WebGL警告:“属性0被禁用。这具有显着的性能损失“的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当我运行下面的JavaScript / WebGL代码(请向下滚动),我在我的开发控制台中看到以下警告消息:

When I run the JavaScript/WebGL code below (please scroll down), I see the following warning message in my development console:

[.WebGLRenderingContext]
PERFORMANCE WARNING: Attribute 0 is disabled.
This has significant performance penalty

下面的代码成功地在画布上绘制了一个白点。但是,我希望警告消失

The code below successfully draws a white dot on the canvas. However, I want the warning to go away. What do I need to change in the code below to make it stop appearing?

HTML:

<!DOCTYPE html>
<html>
<body>
  <canvas id="canvas" width="100" height="100"></canvas>
</body>
</html>

JavaScript:

The JavaScript:

var
    VERTEX_SHADER_SOURCE = ""+
      "void main() {"+
      "  gl_Position = vec4(0.0, 0.0, 0.0, 1.0);"+
      "  gl_PointSize = 10.0;"+
      "}",

    FRAGMENT_SHADER_SOURCE = ""+
      "void main() {"+
      "  gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);"+
      "}",

    canvas = document.getElementById('canvas'),
    gl = canvas.getContext('webgl'),

    vertexShader = gl.createShader(gl.VERTEX_SHADER),
    fragmentShader = gl.createShader(gl.FRAGMENT_SHADER),

    shaderProgram = gl.createProgram();

// Compile the shaders.
gl.shaderSource(vertexShader, VERTEX_SHADER_SOURCE);
gl.compileShader(vertexShader);
gl.shaderSource(fragmentShader, FRAGMENT_SHADER_SOURCE);
gl.compileShader(fragmentShader);

// Create linked program.
gl.attachShader(shaderProgram, vertexShader);
gl.attachShader(shaderProgram, fragmentShader);
gl.linkProgram(shaderProgram);
gl.useProgram(shaderProgram);    

// Clear the canvas.
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.clear(gl.COLOR_BUFFER_BIT);

// Draw the point.
gl.drawArrays(gl.POINTS, 0, 1);

这是一个简单但完整的例子,所以我在寻找一个答案,什么改变。 这是一个JSFiddle的情况。我在Chrome 30.0.1599.101(在OS X 10.8.5)上运行此操作。

This is a minimal, but complete example, so I'm looking for an answer that tells me specifically what to change. Here is a JSFiddle of the case. I'm running this in Chrome 30.0.1599.101 (on OS X 10.8.5).

推荐答案

警告消失,在这里使用线索在其他响应。我将回答我自己的问题,因为我有上面提供的情况下的具体解决方案。

I've managed to get the warning to disappear, using clues in the other responses here. I'm going to answer my own question since I've got the specific solution for the case I provided above.

这里是我做的更改(一般来说)警告:

Here are changes I made (generically speaking) to silence the warning:


  1. 在顶点着色器中为该位置创建属性变量。

  2. 创建

  3. 将属性变量绑定到位置 0
  4. 将属性变量指派给属性变量。

  5. b $ b
  1. Create an attribute variable in the vertex shader for the position.
  2. Create a buffer object, bind it to the array buffer, and write the vertex data to it.
  3. Bind the attribute variable to location 0.
  4. Assign the buffer object to the attribute variable.
  5. Enable assignment to the attribute variable.

这里是特定变更的差异 ,这里是一个JSFiddle演示代码工作没有警告

为了防止这些链接在将来某个时候死亡,我在这里提供相关的代码片段:

Just in case those links die at some point in the future, I'm providing the relevant code snippets here:

顶点着色器源应更改为:

The vertex shader source should be changed to:

attribute vec4 a_Position;
void main() {
  gl_Position = a_Position;
  gl_PointSize = 10.0;
}

下面的JavaScript代码应该直接插入 gl.useProgram(shaderProgram) line:

And the following JavaScript code should be inserted immediately below the gl.useProgram(shaderProgram) line:

var vertices = new Float32Array([0.0, 0.0, 0.0]),
    vertexBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
gl.bindAttribLocation(shaderProgram, 0, 'a_Position');
gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
gl.enableVertexAttribArray(0);

这篇关于WebGL警告:“属性0被禁用。这具有显着的性能损失“的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆