Cómo utilizar la cámara como imagen de textura en Three.js

Question

En three.js, intento crear una textura cuya imagen es la escena actual vista desde una cámara. Usar una CubeCamera para crear un efecto similar está bien documentado; y con CubeCamera He creado un ejemplo de una escena para ilustrar mi objetivo en:

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

Sin embargo, me gustaría usar una cámara normal (más que un CubeCamera) como la textura. ¿Cómo podría hacer esto?

Answer 1

Idealmente, esto funcionaría.

Init:

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); 

Render:

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

Y casi lo hace, pero tenemos algunos asuntos pendientes con texturas-y volteado que arruina la fiesta aquí.

Así que la mejor solución en este momento es utilizar el quad intermediry para voltear la textura (también guarda un render):

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

Answer 2

Sobre la base de ejemplos y sugerencias de mrdoob, he creado un ejemplo de trabajo con comentarios muy detallados, disponible en:

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

parte de mi serie de estilo tutorial serie de ejemplos en Three.js

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