diff --git a/examples/webgl_interactive_points.html b/examples/webgl_interactive_points.html index 3b7cf7b2e1850f..a585cfc276e24b 100644 --- a/examples/webgl_interactive_points.html +++ b/examples/webgl_interactive_points.html @@ -36,6 +36,7 @@ uniform vec3 color; uniform sampler2D pointTexture; + uniform float alphaTest; varying vec3 vColor; @@ -45,7 +46,7 @@ gl_FragColor = gl_FragColor * texture2D( pointTexture, gl_PointCoord ); - if ( gl_FragColor.a < ALPHATEST ) discard; + if ( gl_FragColor.a < alphaTest ) discard; } @@ -120,12 +121,11 @@ uniforms: { color: { value: new THREE.Color( 0xffffff ) }, - pointTexture: { value: new THREE.TextureLoader().load( 'textures/sprites/disc.png' ) } + pointTexture: { value: new THREE.TextureLoader().load( 'textures/sprites/disc.png' ) }, + alphaTest: { value: 0.9 } }, vertexShader: document.getElementById( 'vertexshader' ).textContent, - fragmentShader: document.getElementById( 'fragmentshader' ).textContent, - - alphaTest: 0.9 + fragmentShader: document.getElementById( 'fragmentshader' ).textContent } ); diff --git a/src/materials/Material.js b/src/materials/Material.js index 01ce2a792625fc..9a175ac115706a 100644 --- a/src/materials/Material.js +++ b/src/materials/Material.js @@ -6,6 +6,8 @@ let materialId = 0; class Material extends EventDispatcher { + #alphaTest = 0; + constructor() { super(); @@ -62,7 +64,6 @@ class Material extends EventDispatcher { this.dithering = false; - this.alphaTest = 0; this.alphaToCoverage = false; this.premultipliedAlpha = false; @@ -76,6 +77,24 @@ class Material extends EventDispatcher { } + get alphaTest() { + + return this.#alphaTest; + + } + + set alphaTest( value ) { + + if ( this.#alphaTest > 0 !== value > 0 ) { + + this.version ++; + + } + + this.#alphaTest = value; + + } + onBuild( /* shaderobject, renderer */ ) {} onBeforeCompile( /* shaderobject, renderer */ ) {} diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js index 3025939fc9a932..af7c788bbee828 100644 --- a/src/renderers/shaders/ShaderChunk.js +++ b/src/renderers/shaders/ShaderChunk.js @@ -1,6 +1,7 @@ import alphamap_fragment from './ShaderChunk/alphamap_fragment.glsl.js'; import alphamap_pars_fragment from './ShaderChunk/alphamap_pars_fragment.glsl.js'; import alphatest_fragment from './ShaderChunk/alphatest_fragment.glsl.js'; +import alphatest_pars_fragment from './ShaderChunk/alphatest_pars_fragment.glsl.js'; import aomap_fragment from './ShaderChunk/aomap_fragment.glsl.js'; import aomap_pars_fragment from './ShaderChunk/aomap_pars_fragment.glsl.js'; import begin_vertex from './ShaderChunk/begin_vertex.glsl.js'; @@ -136,6 +137,7 @@ export const ShaderChunk = { alphamap_fragment: alphamap_fragment, alphamap_pars_fragment: alphamap_pars_fragment, alphatest_fragment: alphatest_fragment, + alphatest_pars_fragment: alphatest_pars_fragment, aomap_fragment: aomap_fragment, aomap_pars_fragment: aomap_pars_fragment, begin_vertex: begin_vertex, diff --git a/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js index 5ad0429f687fda..5f971d95be80cd 100644 --- a/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js +++ b/src/renderers/shaders/ShaderChunk/alphatest_fragment.glsl.js @@ -1,7 +1,7 @@ export default /* glsl */` -#ifdef ALPHATEST +#ifdef USE_ALPHATEST - if ( diffuseColor.a < ALPHATEST ) discard; + if ( diffuseColor.a < alphaTest ) discard; #endif `; diff --git a/src/renderers/shaders/ShaderChunk/alphatest_pars_fragment.glsl.js b/src/renderers/shaders/ShaderChunk/alphatest_pars_fragment.glsl.js new file mode 100644 index 00000000000000..90a37fb4ae98be --- /dev/null +++ b/src/renderers/shaders/ShaderChunk/alphatest_pars_fragment.glsl.js @@ -0,0 +1,5 @@ +export default /* glsl */` +#ifdef USE_ALPHATEST + uniform float alphaTest; +#endif +`; diff --git a/src/renderers/shaders/ShaderLib/depth_frag.glsl.js b/src/renderers/shaders/ShaderLib/depth_frag.glsl.js index bfaf55cdd32074..e3a1e31290cd29 100644 --- a/src/renderers/shaders/ShaderLib/depth_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/depth_frag.glsl.js @@ -10,6 +10,7 @@ export default /* glsl */` #include #include #include +#include #include #include diff --git a/src/renderers/shaders/ShaderLib/distanceRGBA_frag.glsl.js b/src/renderers/shaders/ShaderLib/distanceRGBA_frag.glsl.js index 7c78545b38e00f..01c508fee05283 100644 --- a/src/renderers/shaders/ShaderLib/distanceRGBA_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/distanceRGBA_frag.glsl.js @@ -11,6 +11,7 @@ varying vec3 vWorldPosition; #include #include #include +#include #include void main () { diff --git a/src/renderers/shaders/ShaderLib/meshbasic_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshbasic_frag.glsl.js index 6b0d0d45447d7f..ae2a2d63e43aef 100644 --- a/src/renderers/shaders/ShaderLib/meshbasic_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshbasic_frag.glsl.js @@ -15,6 +15,7 @@ uniform float opacity; #include #include #include +#include #include #include #include @@ -42,7 +43,7 @@ void main() { // accumulation (baked indirect lighting only) #ifdef USE_LIGHTMAP - + vec4 lightMapTexel= texture2D( lightMap, vUv2 ); reflectedLight.indirectDiffuse += lightMapTexelToLinear( lightMapTexel ).rgb * lightMapIntensity; diff --git a/src/renderers/shaders/ShaderLib/meshlambert_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshlambert_frag.glsl.js index c38bba8eb46449..c12b4d3b57c2b5 100644 --- a/src/renderers/shaders/ShaderLib/meshlambert_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshlambert_frag.glsl.js @@ -20,6 +20,7 @@ varying vec3 vIndirectFront; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/meshmatcap_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshmatcap_frag.glsl.js index c4902f3231d6a3..677820d499e2f8 100644 --- a/src/renderers/shaders/ShaderLib/meshmatcap_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshmatcap_frag.glsl.js @@ -13,7 +13,7 @@ varying vec3 vViewPosition; #include #include #include - +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/meshphong_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshphong_frag.glsl.js index 30a3437330ed75..f00fb5ab129f35 100644 --- a/src/renderers/shaders/ShaderLib/meshphong_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphong_frag.glsl.js @@ -15,6 +15,7 @@ uniform float opacity; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/meshphysical_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshphysical_frag.glsl.js index 0ca41f6e081cff..a436373326eb97 100644 --- a/src/renderers/shaders/ShaderLib/meshphysical_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshphysical_frag.glsl.js @@ -48,6 +48,7 @@ varying vec3 vViewPosition; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/meshtoon_frag.glsl.js b/src/renderers/shaders/ShaderLib/meshtoon_frag.glsl.js index 7b2749a13061f9..85f0dc375838be 100644 --- a/src/renderers/shaders/ShaderLib/meshtoon_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/meshtoon_frag.glsl.js @@ -13,6 +13,7 @@ uniform float opacity; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/points_frag.glsl.js b/src/renderers/shaders/ShaderLib/points_frag.glsl.js index 46d59bba2ea924..cfee8066172079 100644 --- a/src/renderers/shaders/ShaderLib/points_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/points_frag.glsl.js @@ -5,6 +5,7 @@ uniform float opacity; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/ShaderLib/sprite_frag.glsl.js b/src/renderers/shaders/ShaderLib/sprite_frag.glsl.js index 5c9c951f21d481..0fe57cdff2e972 100644 --- a/src/renderers/shaders/ShaderLib/sprite_frag.glsl.js +++ b/src/renderers/shaders/ShaderLib/sprite_frag.glsl.js @@ -6,6 +6,7 @@ uniform float opacity; #include #include #include +#include #include #include #include diff --git a/src/renderers/shaders/UniformsLib.js b/src/renderers/shaders/UniformsLib.js index b0901632f1c612..a9c91d53e8f12c 100644 --- a/src/renderers/shaders/UniformsLib.js +++ b/src/renderers/shaders/UniformsLib.js @@ -18,6 +18,7 @@ const UniformsLib = { uv2Transform: { value: new Matrix3() }, alphaMap: { value: null }, + alphaTest: { value: 0 } }, @@ -194,6 +195,7 @@ const UniformsLib = { scale: { value: 1.0 }, map: { value: null }, alphaMap: { value: null }, + alphaTest: { value: 0 }, uvTransform: { value: new Matrix3() } }, @@ -206,6 +208,7 @@ const UniformsLib = { rotation: { value: 0.0 }, map: { value: null }, alphaMap: { value: null }, + alphaTest: { value: 0 }, uvTransform: { value: new Matrix3() } } diff --git a/src/renderers/webgl/WebGLMaterials.js b/src/renderers/webgl/WebGLMaterials.js index d23c0b8658e113..74e91fd082189e 100644 --- a/src/renderers/webgl/WebGLMaterials.js +++ b/src/renderers/webgl/WebGLMaterials.js @@ -139,6 +139,12 @@ function WebGLMaterials( properties ) { } + if ( material.alphaTest > 0 ) { + + uniforms.alphaTest.value = material.alphaTest; + + } + const envMap = properties.get( material ).envMap; if ( envMap ) { @@ -351,6 +357,12 @@ function WebGLMaterials( properties ) { } + if ( material.alphaTest > 0 ) { + + uniforms.alphaTest.value = material.alphaTest; + + } + // uv repeat and offset setting priorities // 1. color map // 2. alpha map @@ -399,6 +411,12 @@ function WebGLMaterials( properties ) { } + if ( material.alphaTest > 0 ) { + + uniforms.alphaTest.value = material.alphaTest; + + } + // uv repeat and offset setting priorities // 1. color map // 2. alpha map diff --git a/src/renderers/webgl/WebGLProgram.js b/src/renderers/webgl/WebGLProgram.js index c5743142373503..ed472bf3a86b78 100644 --- a/src/renderers/webgl/WebGLProgram.js +++ b/src/renderers/webgl/WebGLProgram.js @@ -598,8 +598,6 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { customDefines, - parameters.alphaTest ? '#define ALPHATEST ' + parameters.alphaTest + ( parameters.alphaTest % 1 ? '' : '.0' ) : '', // add '.0' if integer - '#define GAMMA_FACTOR ' + gammaFactorDefine, ( parameters.useFog && parameters.fog ) ? '#define USE_FOG' : '', @@ -629,7 +627,9 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) { parameters.specularTintMap ? '#define USE_SPECULARTINTMAP' : '', parameters.roughnessMap ? '#define USE_ROUGHNESSMAP' : '', parameters.metalnessMap ? '#define USE_METALNESSMAP' : '', + parameters.alphaMap ? '#define USE_ALPHAMAP' : '', + parameters.alphaTest ? '#define USE_ALPHATEST' : '', parameters.sheenTint ? '#define USE_SHEEN' : '', parameters.transmission ? '#define USE_TRANSMISSION' : '', diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js index 9f9731307a9959..7f571246318f7b 100644 --- a/src/renderers/webgl/WebGLPrograms.js +++ b/src/renderers/webgl/WebGLPrograms.js @@ -41,13 +41,13 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities 'clearcoat', 'clearcoatMap', 'clearcoatRoughnessMap', 'clearcoatNormalMap', 'displacementMap', 'specularMap', 'specularIntensityMap', 'specularTintMap', 'specularTintMapEncoding', 'roughnessMap', 'metalnessMap', 'gradientMap', - 'alphaMap', 'combine', 'vertexColors', 'vertexAlphas', 'vertexTangents', 'vertexUvs', 'uvsVertexOnly', 'fog', 'useFog', 'fogExp2', + 'alphaMap', 'alphaTest', 'combine', 'vertexColors', 'vertexAlphas', 'vertexTangents', 'vertexUvs', 'uvsVertexOnly', 'fog', 'useFog', 'fogExp2', 'flatShading', 'sizeAttenuation', 'logarithmicDepthBuffer', 'skinning', 'maxBones', 'useVertexTexture', 'morphTargets', 'morphNormals', 'premultipliedAlpha', 'numDirLights', 'numPointLights', 'numSpotLights', 'numHemiLights', 'numRectAreaLights', 'numDirLightShadows', 'numPointLightShadows', 'numSpotLightShadows', 'shadowMapEnabled', 'shadowMapType', 'toneMapping', 'physicallyCorrectLights', - 'alphaTest', 'doubleSided', 'flipSided', 'numClippingPlanes', 'numClipIntersection', 'depthPacking', 'dithering', + 'doubleSided', 'flipSided', 'numClippingPlanes', 'numClipIntersection', 'depthPacking', 'dithering', 'sheenTint', 'transmission', 'transmissionMap', 'thicknessMap' ]; @@ -154,6 +154,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities const currentRenderTarget = renderer.getRenderTarget(); + const useAlphaTest = material.alphaTest > 0; const useClearcoat = material.clearcoat > 0; const parameters = { @@ -208,6 +209,7 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities specularTintMap: !! material.specularTintMap, specularTintMapEncoding: getTextureEncodingFromMap( material.specularTintMap ), alphaMap: !! material.alphaMap, + alphaTest: useAlphaTest, gradientMap: !! material.gradientMap, @@ -264,7 +266,6 @@ function WebGLPrograms( renderer, cubemaps, cubeuvmaps, extensions, capabilities premultipliedAlpha: material.premultipliedAlpha, - alphaTest: material.alphaTest, doubleSided: material.side === DoubleSide, flipSided: material.side === BackSide,