在three.js中解压缩RGBA深度值

我正在尝试使用MeshDepthMaterial在three.js中实现一个简单的GPU选取器。我已经成功使用下面的示例中提取颜色值： https://github.com/mrdoob/three.js/blob/master/examples/webgl_interactive_cubes_gpu.html 在three.js中解压缩RGBA深度值

而且通过移植unpackRGBAToDepth功能从这里到JavaScript来重建深度：

https://github.com/mrdoob/three.js/blob/acdda10d5896aa10abdf33e971951dbf7bd8f074/src/renderers/shaders/ShaderChunk/packing.glsl

但价值出来的一个在0.0到255.0之间的浮点数（我期望它在0.0到1.0之间或实际深度）。我的问题如下：我怎样才能使用这个值，它可以被翻译成实际的深度？如果是这样，怎么样？

来源

2017-03-07 Avocher

http://stackoverflow.com/questions/6652253/getting-the-true-z-value-from-the-深度缓冲和https://www.opengl.org/discussion_boards/showthread.php/171104-Convert-value-from-Z-buffer-to-Z-coordinate – gaitat

我的实现是非常接近的stackoverflow答案，但我使用对数深度缓冲区，因此它略有不同。我创建了一个例子：http://jsfiddle.net/1x4Lk8w6/1/在那里我试图得到实际的深度，但它最终总是1，如果有鼠标下的东西。 – Avocher

在更改相机的远平面时检查效果。 10000很大。 – gaitat

自己在运行这个问题后（可能遵循从three.js中复制代码的相同路径），我可能会发现问题。

从JS中的RGBA-Texture读取时，将以Uint8格式获取颜色值，而GLSL中的纹理查找（我怀疑计算是从那里复制的）返回rgba-float值。

所以你需要拆包之前1/255乘以颜色向量：

// ... 

renderer.readRenderTargetPixels(
    depthRenderTarget, x, y, 1, 1, pixelBuffer); 

vec4 
    .fromArray(pixelBuffer) 
    .multiplyScalar(1/255); 

var logz = vec4.dot(unPackFactors); 

// ...

来源

2017-05-18 23:00:15

在three.js中解压缩RGBA深度值

回答

相关问题