问题标签 [webgl2]

我正在尝试渲染一些飞机，我想使用gl.blendEquation( gl.MIN ). 我正在从后到前渲染，并在渲染循环中清除颜色缓冲区

然后我得到一个黑色的背景。问题是平面与背景混合在一起，我看不到平面，因为背景具有 MIN 值。

一种可能的解决方案是在不混合的情况下绘制第一个平面，然后使用混合绘制将避免背景，但我使用的是视口对齐的切片，我遇到了问题，因为在某些情况下第一个平面很小（如下图所示）更大的平面与背景融为一体。

数字

如果我用白色绘制背景，问题就解决了，但我需要用黑色绘制背景。有什么方法可以做到这一点？

任何建议将不胜感激！

线条随着距离变得不连贯的示例
。

我一直在尝试通过使用 uv 坐标（无纹理图像）来渲染边缘着色的立方体。最终结果看起来有点不稳定，我已经看过足够多的 webgl 演示，知道可以避免这种情况，但不知道如何避免。

我认为这可能与精度有关，所以我尝试提高着色器的精度和/或减少近/远平面，但没有成功。

对于 WebGL 2 画布，我需要一个简单的“拾取”系统，即在 2D 中给定一个点p，系统可以判断哪个对象（如果有）被渲染到p。（我不需要 CPU 中的选择结果，只需要在着色器中。）

为了实现这一点，每个对象都将使用不同的“颜色 id”渲染到专用于拾取的帧缓冲区。我正在考虑使用 R16UI 或 R32UI 纹理格式和 GL_NEAREST 过滤。我关心的是抗锯齿：我如何保证对象的边缘不会被抗锯齿，从而改变输出值，破坏拾取系统？

我正在寻找禁用抗锯齿的代码，以及从了解标准的人那里得到/不能保证的解释。

我一直在尝试使用 GPU 从图片（实际上是实时相机预览）生成颜色直方图，因此opengl-es. 我遇到了GPUImage包含histogram filter的库。我不能直接使用这个库，因为我正在使用react-nativeExpo's GLView（如此处所述），并且我不想处理本机代码。

话虽如此，我应该能够调整代码以使用WebGL API由GLView. 我一直试图做到这一点，但检索到的直方图数据只包含“黑色像素”。

定义着色器：

辅助函数（供参考）

在里面

渲染循环

直方图数据仅包含零（而相机像素数据是有效/非零值）。错误可能在帧缓冲区附近；在“模型”中，帧缓冲区有一个定义的大小，但我看不到如何转置它。（错误也可能来自其他地方）。

我无法将R32F纹理绑定到，因为根据此来源framebuffer，此类纹理不是“默认情况下可渲染颜色” 。

但随后它说“这些功能可作为可选扩展使用”。

如何使用这些扩展？我如何让它工作？

我正在使用empscripten。经过几次测试，我得出的结论是，如果我绘制 500 个相同的纹理，一切正常。但是如果我绘制 2 个不同的纹理 500 次，我会在 CPU 上承受很大的负担。14 对 60% 在 osx 上。在 windows 中，几乎相同的问题（6 对 16%），只是差异很小。两种纹理的大小均为 2x2 像素。

我可以以某种方式优化它吗？

我使用 WebGL1 已经有一段时间了，但现在我正在学习更多关于 WebGL2 的知识，我很困惑Vertex Arrays 的实际作用。例如，在下面的示例中，我可以删除对它们的所有引用（例如创建、绑定、删除）并且示例继续工作。

我一直在阅读这些示例的源代码，并且继续看到此选项，但是，我无法找到任何地方是否支持此功能。您是否只需antialias打开此标志即可获得？有关此功能的更多详细信息吗？

随着我对 WebGL2 的更多了解，我在着色器中遇到了这种新语法，您可以location通过以下方式在着色器内部设置：layout (location=0) in vec4 a_Position;. attribute这与使用传统方法获取位置相比如何gl.getAttribLocation('a_Position');. 我认为它更快？还有其他原因吗？另外，将位置设置为整数更好还是也可以使用字符串？

我如何了解具有某些 GPU 的 PC 是否支持 WebGL 2.0？感谢您是否可以提供任何有用的链接到经过验证的文档。