0

所以这是一个有点模糊的问题，可能是由于我对 WebGL (OpenGL) 的内部知识仍然有限（但正在改进），特别是在 GL 上下文中管理状态的方式。请让我澄清或/并添加更多细节。因为我不确切知道问题出在哪里，所以我尽可能多地提供信息。

我有一种情况，我正在实施选择一个微型渲染引擎。当我有一个简单的着色器时，一切正常，每个对象都以恒定的颜色渲染。每个对象有 2 个缓冲区，一个 ARRAY_BUFFER 和一个 ELEMENT_ARRAY_BUFFER。拾取方面是通过一个额外的 FrameBuffer 实现的，其中使用“拾取”着色器将场景渲染给它。当我需要渲染拾取帧时，我切换到备用 FrameBuffer，然后切换到拾取着色器 (gl.useProgram())，渲染场景，然后切换回默认画布 FrameBuffer。然后我读出单击的画布坐标处的像素值，并使用该值来查找特定元素的 ID...我什至将整个 FrameBuffer 渲染到单独的画布上，作为调试步骤，并将该画布显示在DOM，

当我打开顶点着色时，麻烦就来了。每个顶点指定颜色值，并作为 VertexAttribArray （与顶点坐标相同）传递到着色器。但是，当着色打开时，拾取渲染不会渲染任何内容（输出为空白屏幕）。

我已经隔离了导致此错误出现的着色功能部分（拾取框的空白渲染）：

Buffer vertex_color_buffer = gl.createBuffer();
gl.bindBuffer(RenderingContext.ARRAY_BUFFER,vertex_color_buffer);

gl.bufferData(RenderingContext.ARRAY_BUFFER,
              new Float32List.fromList(unpacked_colors_lst), 
              RenderingContext.STATIC_DRAW); 

int color_attr_location = gl.getAttribLocation(p_shader, 
                                               "a_vertex_color");
gl.enableVertexAttribArray(color_attr_location);    
gl.vertexAttribPointer(color_attr_location,
                       4,
                       RenderingContext.FLOAT, 
                       false, 
                       4*Float32List.BYTES_PER_ELEMENT, //stride
                       0);                              //offset within the buffer

所以很明显，在这些行中设置了一些 GL 状态，然后，当着色器从顶点着色着色器（正确显示事物）切换到拾取着色器时，导致场景不被渲染。我认为我的顶点转换可能有问题，但它们在着色着色器和拾取着色器之间是相同的，但是着色着色器显示的东西很好，而拾取着色器却没有。

请让我知道我还需要包括什么才能使这个问题更清楚。我花了几天时间尝试调试它，但仍然没有任何想法。（ps.代码是用 Dart 写的）。

4

1 回答 1

1

'color_attr_location' 和您的拾取着色器中的某些属性可能共享相同的位置（仅从该代码很难分辨），因此当您指定数组时，一个正在替换另一个。如果您只设置一次阵列然后切换程序而不再次设置它们，这很可能是问题所在。

AFAIK 在 WebGL 中，您需要在每次绘制调用之前手动设置顶点数组（而不是使用顶点数组对象），这意味着之后再次禁用它们可能是最佳实践。

使用程序 -> 设置阵列 -> 渲染 -> 禁用阵列 -> 使用其他程序 -> 设置阵列

于 2013-06-16T14:47:01.763 回答