In my scene i have a glowing cube. Firstly, i render the cube on a texture and then render the texture applying gaussian blur post processing. In this way i get the result right when i am not in VR mode. Here it is -
But when i go to VR mode, it gives me distorted result. Please check the following image -
Can anyone please tell me why is happening? Do i have to make any adjustment to render on texture for VR mode?
Update:
My code is like this -
function render() {
generate_blur_texture();
effect.render(scene, camera);
}
var rtTexture = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter, format: THREE.RGBAFormat});
var rtTextureFinal = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter, format: THREE.RGBAFormat});
function generate_blur_texture() {
// i think the key point is, i am using `renderer` here instead of 'effect'
renderer.render(scene, camera, rtTexture, true);
// then further rendering on rtTexture and rtTextureFinal (ping pong) to generate blur, this time i only draw a quad to sample from the texture
// ultimately, rtTexture contains the blurred texture
}
Three.js Revision: 77