1.创建ShaderPass对象 let SweepingLightShader = { uniforms: { “tDiffuse”: {type: “t”, value: 0.0}, “time”:{type: “f”, value: 1.0} }, vertexShader:varying vec2 vUv; varying vec3 iPosition; void main(){ vUv = uv; iPosition = position; gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); }, fragmentShader:` uniform float time; uniform sampler2D tDiffuse; varying vec2 vUv; varying vec3 iPosition; void main(){ vec4 texel = texture2D(tDiffuse, vUv); float x = iPosition.x; float lighty = x*1.2 + time; float alpha = abs(iPosition.y - lighty); if(alpha < 0.1){ float a = 1.0 - alpha / 0.1; float enda = smoothstep(0.0,1.0,a) + 0.3; gl_FragColor = texel * enda; }else{ gl_FragColor = texel * 0.3; }
} ` }; 2.实例 customGrayScale = new THREE.ShaderPass(SweepingLightShader); customGrayScale.needsUpdate=true window.customGrayScale=customGrayScale composer.addPass(customGrayScale); 3.animate //扫光 var time =customGrayScale.uniforms.time.value; if(time > 2.0){ type = ‘reduce’ }else if(time < -2.0){ type = ‘add’; } if(type ==‘add’){ customGrayScale.uniforms.time.value += 0.01; }else{ customGrayScale.uniforms.time.value -= 0.01; }
