解决WebGL readPixels的问题很慢

作者: 小鬼
发布时间: 2024-05-11 03:54:07 (3天前)
转自：

3 条回复

0#
回复此人
一腔诗意 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> 我对你的用例知之甚少，但只是猜测，为什么你需要读取像素？ 首先，您不需要在WebGL中绘制文本或图表的静态部分。将另一个canvas或svg或img放在WebGL画布上，设置css使它们重叠。让浏览器合成它们。那你就不必这样做了。 其次，让我们假设您有一个纹理，其中包含您的计算结果。难道你不能只是制作一些与图中需要颜色的地方相匹配的几何图形，并使用纹理坐标从结果纹理中的正确位置查找结果吗？然后你根本不需要调用readPixels。该着色器可以使用渐变纹理查找或任何其他技术将结果转换为其他颜色以遮蔽图表的动画部分。 如果要根据可以使用的结果绘制数字 <a href="http://blog.tojicode.com/2012/07/sprite-tile-maps-on-gpu.html" rel="nofollow"> 像这样的技术 </A> 因此，您可以在引用结果着色器时创建着色器以查看结果值，然后根据该着色器对另一个纹理中的字形进行索引。 我有意义吗？ </DIV>

编辑
1#
回复此人
清月 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <BLOCKQUOTE> 在完成所有渲染调用之后，我是否应该尝试使readPixel调用全部发生（可能允许一些流水线操作）？ </BLOCKQUOTE> 对对对。 readPixels基本上是一个阻塞，管道停止操作，和的 无论发生什么，它总是会扼杀你的表现 </强> ，因为它正在向GPU发送数据请求 然后等待它回应 ，正常的绘制调用不必做。 尽可能少地使用readPixels（使用单个组合缓冲区进行读取）。尽可能晚做。其他一切都不重要。 <BLOCKQUOTE> 我是否应该避免获取信息，并进行所有布局和渲染gpu-side（urgh ...）？ </BLOCKQUOTE> 这将为您带来极佳的性能。 如果你的图形都像你上面所显示的那样，你根本不应该做任何 layout ？（这很好，因为它实施起来很尴尬）除了文字之外的一切都是某种可以在着色器中轻松完成的颜色或边界动画，并且所有布局都可以只是一个静态顶点缓冲区（每个顶点都有一个属性，指向它应该依赖的模拟状态 - 纹素）。 文本将更加繁琐仅仅因为您需要将所有数字加载到纹理中以用作spritesheet并对其进行查找，但这是一种标准技术。（哦，除以/ modulo得到数字。） </DIV>

编辑

登录后才能参与评论