1.Shader脚本
代码语言:javascript复制var DarkMaskShader = {
uniforms: {
"tDiffuse": {
value: null
},
"maskColor": {
value: new THREE.Color(0x000000)
},
"maskAlpha": {
value: 1.0
},
"markRadius": {
value: 0.15
},
"smoothSize": {
value: 0.5
}
},
vertexShader: [
"varying vec2 vUv;",
"void main() {",
" vUv = uv;",
" gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
"}"
].join("n"),
fragmentShader: [
"uniform float maskAlpha;",
"uniform vec3 maskColor;",
"uniform float markRadius;",
"uniform float smoothSize;",
"uniform sampler2D tDiffuse;",
"varying vec2 vUv;",
"float sdfCircle(vec2 coord, vec2 center, float radius)",
"{",
" vec2 offset = coord - center;",
" return sqrt((offset.x * offset.x) (offset.y * offset.y)) - radius;",
"}",
"void main() {",
" vec4 texel = texture2D( tDiffuse, vUv );",
" float sdfValue = sdfCircle(vUv, vec2(0.5, 0.5), markRadius);",
" if (sdfValue < 0.0){",
" gl_FragColor = texel;",
" }else{",
" float a = smoothstep(0.0, smoothSize, sdfValue);",
" gl_FragColor = mix(texel, vec4(maskColor, maskAlpha), a);",
" }",
"}"
].join("n")
};
2.后处理通道增加ShaderPass
代码语言:javascript复制let effectDarkMask = new THREE.ShaderPass( DarkMaskShader );
finalComposer.addPass(effectDarkMask);