javascript - 如何在 Three.js 中使用相机作为纹理图像

Question

在three.js 中，我试图创建一个纹理，其图像是从相机查看的当前场景。使用 CubeCamera 创建类似的效果是有据可查的；并使用 CubeCamera 创建了一个场景示例来说明我的目标：

http://stemkoski.github.com/Three.js/Camera-Texture-Almost.html

但是，我想使用普通相机（而不是 CubeCamera）作为纹理。我怎么能这样做？

Answer 1

理想情况下，这会起作用。

在里面：

renderTarget = new THREE.WebGLRenderTarget( 512, 512, { format: THREE.RGBFormat } );

var planelikeGeometry = new THREE.CubeGeometry( 400, 200, 200 );
var plane = new THREE.Mesh( planelikeGeometry, new THREE.MeshBasicMaterial( { map: renderTarget } ) );
plane.position.set(0,100,-500);
scene.add(plane);

使成为：

renderer.render( scene, topCamera, renderTarget, true );
renderer.render( scene, topCamera );

它几乎是这样，但我们还有一些未完成的事情，因为 y 翻转纹理毁了这里的派对。

所以目前最好的解决方案是使用中间四边形来翻转纹理（也节省了渲染）：

http://mrdoob.github.com/three.js/examples/webgl_rtt.html

Answer 2

根据 mrdoob 的示例和建议，我创建了一个带有非常详细评论的工作示例，可在以下位置获取：

http://stemkoski.github.com/Three.js/Camera-Texture.html

我的教程式 Three.js 系列示例系列的一部分，位于

http://stemkoski.github.com/Three.js/