three.js - FBO 模拟着色器中的纹理查找

Question

我试图通过在单独的 channel 中计算位置来制作 FBO 粒子系统。
现在使用这篇文章中的代码http://barradeau.com/blog/?p=621 .我渲染粒子球体，没有任何运动:

到目前为止我唯一添加的是模拟片段着色器中的纹理:

void main() {
    vec3 pos = texture2D( texture, vUv ).xyz;
    //THIS LINE, pos is approx in -200..200 range
    float map = texture2D(texture1, abs(pos.xy/200.)).r;
    ...
    // save map value in ping-pong texture as alpha
    gl_FragColor = vec4( pos, map );

texture1 是:一半黑一半白。

然后在render顶点着色器中我读取了这个贴图参数:

map = texture2D( positions, position.xy ).a;

并在渲染片段着色器中使用它来查看颜色:

vec3 finalColor = mix(vec3(1.,0.,0.),vec3(0.,1.,0.),map);
gl_FragColor = vec4( finalColor, .2 );

所以我希望看到的是:(通过在 render 着色器中设置相同的纹理制作)

但我真正看到的是:(通过在模拟着色器中设置纹理)

颜色混合了，虽然大多数情况下你可以在应该出现的地方看到更多的红色，但中间有很多绿色颗粒。
还尝试用简化的纹理和相同的想法制作我自己的演示，我得到了这个:

同样是混淆了，不过还是能猜到图。同样的错误。
我想我错过了一些明显的东西。但是现在我已经为此苦苦挣扎了几天，无法自己发现错误。

非常感谢有人为我指出正确的方向。提前致谢!

有错误的演示:http://cssing.org.ua/examples/fbo-error/
我指的是完整代码:https://github.com/akella/fbo-test

Answer 1

您应该使用 GL_NEAREST min/mag 过滤器禁用纹理过滤。