changed param to pixelSize

examples/js/shaders/PixelShader.js

@@ -9,7 +9,8 @@ THREE.PixelShader = {
 	uniforms: {
 
 		"tDiffuse": { value: null },
-		"pixels": { value: 2048. }
+		"resolution": { value: null },
+		"pixelSize": { value: 1. },
 
 	},
 
@@ -29,14 +30,15 @@ THREE.PixelShader = {
 	fragmentShader: [
 
 		"uniform sampler2D tDiffuse;",
-		"uniform float pixels;",
+		"uniform float pixelSize;",
+		"uniform vec2 resolution;",
 
 		"varying highp vec2 vUv;",
 
 		"void main(){",
 
-		"float dx = (1.0 / pixels);",
-		"float dy = (1.0 / pixels);",
+		"float dx = pixelSize * (1./resolution.x);",
+		"float dy = dx;",
 		"vec2 coord = vec2(dx * floor(vUv.x / dx), dy * floor(vUv.y / dy));",
 		"gl_FragColor = texture2D(tDiffuse, coord);",
 

examples/webgl_postprocessing_pixel.html

@@ -64,7 +64,7 @@
 
             function updateGUI() {
 
-                pixelPass.uniforms.pixels.value = params.pixels;
+                pixelPass.uniforms.pixelSize.value = params.pixelSize;
 
             }
 
@@ -145,18 +145,24 @@
                 composer = new THREE.EffectComposer( renderer );
                 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.renderToScreen = true;
                 composer.addPass( pixelPass );
 
+                pixelPass.uniforms.resolution.value = res;
+
                 window.addEventListener( 'resize', resize );
 
                 params = {
-                    pixels: 256,
+                    pixelSize: 128,
                     postprocessing: true
                 };
                 gui = new dat.GUI();
-                gui.add( params, 'pixels' ).min( 12.0 ).max( 256.0 ).step( 2.0 );
+                gui.add( params, 'pixelSize' ).min( 2 ).max( 256 ).step( 2 );
                 gui.add( params, 'postprocessing' );
 
             }