Răsfoiți Sursa

changed shader to account for resolutions in each direction

Bryan Wong 7 ani în urmă
părinte
comite
b04eed4c6e

+ 2 - 3
examples/js/shaders/PixelShader.js

@@ -37,9 +37,8 @@ THREE.PixelShader = {
 
 
 		"void main(){",
 		"void main(){",
 
 
-		"float dx = pixelSize * (1./resolution.x);",
-		"float dy = dx;",
-		"vec2 coord = vec2(dx * floor(vUv.x / dx), dy * floor(vUv.y / dy));",
+		"vec2 dxy = pixelSize / resolution;",
+		"vec2 coord = dxy * floor( vUv / dxy );",
 		"gl_FragColor = texture2D(tDiffuse, coord);",
 		"gl_FragColor = texture2D(tDiffuse, coord);",
 
 
 		"}"
 		"}"

+ 4 - 6
examples/webgl_postprocessing_pixel.html

@@ -74,6 +74,8 @@
                 camera.updateProjectionMatrix();
                 camera.updateProjectionMatrix();
                 renderer.setSize( window.innerWidth, window.innerHeight );
                 renderer.setSize( window.innerWidth, window.innerHeight );
 
 
+                pixelPass.uniforms.resolution.value.set( window.innerWidth, window.innerHeight ).multiplyScalar( window.devicePixelRatio );
+
             }
             }
 
 
             function init() {
             function init() {
@@ -145,16 +147,12 @@
                 composer = new THREE.EffectComposer( renderer );
                 composer = new THREE.EffectComposer( renderer );
                 composer.addPass( new THREE.RenderPass( scene, camera ) );
                 composer.addPass( new THREE.RenderPass( scene, camera ) );
 
 
-                var res = new THREE.Vector2();
-                res.x = window.screen.width * window.devicePixelRatio;
-                res.y = window.screen.height * window.devicePixelRatio;
-
                 pixelPass = new THREE.ShaderPass( THREE.PixelShader );
                 pixelPass = new THREE.ShaderPass( THREE.PixelShader );
+                pixelPass.uniforms.resolution.value = new THREE.Vector2( window.innerWidth, window.innerHeight );
+                pixelPass.uniforms.resolution.value.multiplyScalar( window.devicePixelRatio );
                 pixelPass.renderToScreen = true;
                 pixelPass.renderToScreen = true;
                 composer.addPass( pixelPass );
                 composer.addPass( pixelPass );
 
 
-                pixelPass.uniforms.resolution.value = res;
-
                 window.addEventListener( 'resize', resize );
                 window.addEventListener( 'resize', resize );
 
 
                 params = {
                 params = {