Three.js渲染到纹理同步摄影机

Question

我必须将alpha着色滤镜应用于点云，如链接：https://www.mapbox.com/blog/colorize-alpha-image-filter/所述，以实现一种热图。

我在纹理上渲染一个二维点云，然后使用处理colorize-alpha过滤的自定义着色器将其渲染到一个平面中。

问题是，我不明白如何才能正确地缩放纹理化的点云，同时保持点云点的原始大小。

我已经创建了一个简化的示例，没有使用真正的colorize-alpha过滤，但使用了我的render-to-texture结构：http://jsfiddle.net/q8fpt7eL/1/

我想要达到的效果与直接绘制点云时所能达到的效果完全相同。在jsfiddle上，您只需注释RTT部分，并取消对直接呈现部分的注释，即可查看我所说的内容。

//render to texture
//renderer.render(sceneRTT, cameraRTT, rtTexture, false);
//renderer.render(scene, camera);

//render directly the point cloud
renderer.render(sceneRTT, camera);

我已经尝试使用相同的相机，或者复制cameraRTT对象上的相机位置/旋转，但似乎无法正常工作。我也尝试过在RTT场景中使用正射相机，但没有成功。

有谁知道我怎样才能实现我的目标？

谢谢

Answer 1

在第41行，您正在设置OrbitControls来控制“平面场景”的摄像机，而您确实希望它能够控制RTT场景。试试这个：

new THREE.OrbitControls(cameraRTT, renderer.domElement);

这样看起来好多了，您可以在点云内部进行缩放。

最后，您所要做的就是使camera正交，并设置您的平面，使其填充场景。