问题标签 [webgl2]

帮我理解如何在PIXI中更改颜色有一张红色的图片假设 需要将颜色从红色更改为绿色，用于prtimerna。而是让影子留下，也就是给定了基调。

我可以逐个像素地做到这一点。如果对算法有想法，我也将不胜感激

但我想将其更改为 VVGL 我非常感谢您的帮助

如果我已将数据渲染到 R32F 纹理（2^18 (~250,000) 纹素）并且我想计算这些值的总和，是否可以通过要求 gpu 生成 mipmap 来做到这一点？

（想法是最小的mipmap级别将有一个包含所有原始纹素平均值的纹素）

我将使用哪些 mipmap 设置（钳位等）来生成正确的平均值？

我对 webgl 体操不太擅长，并且希望了解如何将 1 到 2^18 的数字渲染到 R32F 纹理中，然后在该纹理上产生总和。

对于这个数量的纹素，这种方法会比尝试将纹素传输回 cpu 并在 javascript 中执行求和更快吗？

谢谢！

我弄错了还是 WebGL2ReneringContext 不应该公开 SRGB_ALPHA 的属性？Chrome 仅公开 SRGB、SRGB8 和 SRGB8_ALPHA8。

我在使用带有 WebGL2 的 sRGB 纹理时遇到问题。我正在尝试加载纹理并将其显示为全屏四边形，但图像显示不正确（太暗。）

纹理加载代码如下。

我在想它可能与帧缓冲区的编码有关，但我确实在 WebGL 中看到了 glEnable(GL_FRAMEBUFFER_SRGB) 的等价物。

正如 WebGL 2 官方规范或文档中所述（请看这里），gl.RGBA16UI 内部尺寸格式是一种颜色可渲染格式。这意味着我应该能够渲染到 RGBA16UI 纹理。

我可以轻松地用 UInt16Array 填充纹理，然后使用它。但是我无法使用着色器将纹理渲染填充到其中。然后，当我在下一个着色器中对值进行采样时，我只会得到零。

是否有人已经成功使用 WebGL 2 渲染到无符号整数纹理？我将非常感激，我正在使用纹理格式数周，但我不明白我在这里做错了什么......而且我在其他关于该主题的 SO 问题中没有发现我的错误。

您可以在下面的代码段中找到完整的代码。左侧打印的 6 种颜色是显示填充了 UInt16Array 的 RGBA16UI 纹理的结果。在右侧，如果渲染到 RGBA16UI 纹理成功，我们应该得到相同的结果。

[编辑] 那只是一个愚蠢的错字。我更新了我的代码，并接受了 gman 答案作为如何在 WebGL 2 中渲染为无符号整数纹理的两个功能示例。

谢谢你读我。

I have a PNG file with dimensions 128x32128 (equivalent to 251 128x128 layers) and when I try the following:

I get a browser error reading WebGL: INVALID_VALUE: texSubImage3D: width, height or depth out of range

However, if I try something very similar with another image of dimension 128x8192 (equivalent to 64 layers of 128x128) I get no error:

However, if I try the same code with the original image I get the same error:

This does not make any sense. Surely this is an implementation bug, as the only thing that changed from example 2 to example 3 was the image, not the parameters to texSubImage3D.

Browser: Chrome v67 on Windows 7 x64

在 WebGL2 中，大多数现有函数都有其他版本，它们接受ArrayBuffer允许在这些缓冲区内传递偏移量和长度的 s。据说，这应该更容易从 WebAssembly 内存中传递数据而无需创建临时视图，但有一个问题：这些函数只接受ArrayBufferView.

1. 这种限制的原因是什么？为什么将字节复制到 GPU 的函数应该关心它们的语义，即 Uint8/Int32/Float32 等？
2. 如何绕过它，而不是DataView每次都创建一个（这将完全违背首先使用这些功能的目的）？一次创建 DataView 是行不通的，因为 WebAssembly 内存可以重新分配其缓冲区，并且无法设置内存调整大小的回调。

我正在研究deck.gl旅行路线示例 http://deck.gl/#/examples/custom-layers/trip-routes

我想在图层中实现可选功能。在设置pickable: true图层属性并增加可拾取半径时，结果与预期不同。

然后我跟着https://github.com/uber/deck.gl/blob/master/docs/get-started/interactivity.md和https://github.com/uber/deck.gl/blob/master/docs /developer-guide/picking.md实现自定义拾取。然而，这并没有奏效。

在优化我们的 WebGL2 渲染引擎时，我尝试将着色器接口（片段着色器和顶点着色器之间）中的一些变量指定为“平面”。这些变量确实可以被视为平坦的，并且对于整个渲染的几何图形基本上是一致的。（但它们被加载到顶点着色器中）。

前：

后：

但是，这种简单的更改会导致性能大幅下降。在相同的数据上，我的渲染器从 50fps 下降到 ~20fps。很难找到有关着色器接口以及它们如何影响性能的信息。我希望“平坦”变量比平滑变量更有效。

我知道我在顶点和片段着色器之间传递了大量数据，并且相信这可能是渲染中的瓶颈，但很难确认这一点。

我想知道是否由于 ANGLE 接口层，生成的 HLSL 生成效果不佳，导致效率有很大差异。

我正在尝试从@types/webgl2我的项目中导入一些类型。我遵循了这里提到的每一条建议： TypeScript Typings give me "index.d.ts is not a module"

将此添加到顶部：import 'webgl2';

• 我已经确定“ modeResolution”是“ true”在tsconfig.json
• 我"types":["webgl2"]在我的tsconfig.json
• 添加 "@types/webgl2": "0.0.4"到devDependencies和dependencies中package.json。
• 在我的项目文件夹中安装了 npm：

我可以很容易地看到webgl2，node_modules/@types我还可以在下面看到所有错误符号的声明：

我仍然收到这些错误：

对应：