Browse Source

Added flipping workaround to RTT example.

Please note that render target must be power-of-2 sized for this trick to work. Other option would be to change directly UVs in the geometry (though that would make it harder to swap image vs render target as texture or to share geometry between objects using materials with images vs render targets).

Fixes #2164
alteredq 13 years ago
parent
commit
9a93e54884
1 changed files with 16 additions and 2 deletions
  1. 16 2
      examples/webgl_rtt.html

+ 16 - 2
examples/webgl_rtt.html

@@ -82,6 +82,18 @@
 
 		</script>
 
+		<script id="vertexShaderFlip" type="x-shader/x-vertex">
+
+			varying vec2 vUv;
+
+			void main() {
+
+				vUv = vec2( uv.x, 1.0 - uv.y );
+				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+
+			}
+
+		</script>
 
 		<script>
 
@@ -132,7 +144,9 @@
 				light.position.set( 0, 0, -1 ).normalize();
 				sceneRTT.add( light );
 
-				rtTexture = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter, format: THREE.RGBFormat } );
+				rtTexture = new THREE.WebGLRenderTarget( 1024, 1024, { minFilter: THREE.LinearMipMapLinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat } );
+				rtTexture.wrapS = rtTexture.wrapT = THREE.RepeatWrapping;
+				rtTexture.repeat.set( 1, -1 );
 
 				material = new THREE.ShaderMaterial( {
 
@@ -145,7 +159,7 @@
 				var materialScreen = new THREE.ShaderMaterial( {
 
 					uniforms: { tDiffuse: { type: "t", value: 0, texture: rtTexture } },
-					vertexShader: document.getElementById( 'vertexShader' ).textContent,
+					vertexShader: document.getElementById( 'vertexShaderFlip' ).textContent,
 					fragmentShader: document.getElementById( 'fragment_shader_screen' ).textContent,
 
 					depthWrite: false