소스 검색

Removed webgl_materials_parallaxmap (#22370)

* Removed webgl_materials_envmas_parallax example.

* Removed webgl_materials_parallaxmap.
Mr.doob 4 년 전
부모
커밋
d676f6d466

+ 0 - 1
docs/api/en/materials/ShaderMaterial.html

@@ -109,7 +109,6 @@
 			[example:webgl_marchingcubes webgl / marchingcubes]<br />
 			[example:webgl_materials_envmaps webgl / materials / envmaps]<br />
 			[example:webgl_materials_lightmap webgl / materials / lightmap]<br />
-			[example:webgl_materials_parallaxmap webgl / materials / parallaxmap]<br />
 			[example:webgl_materials_wireframe webgl / materials / wireframe]<br />
 			[example:webgl_modifier_tessellation webgl / modifier / tessellation]<br />
 			[example:webgl_postprocessing_dof2 webgl / postprocessing / dof2]<br />

+ 0 - 1
docs/api/zh/materials/ShaderMaterial.html

@@ -99,7 +99,6 @@
 			[example:webgl_marchingcubes webgl / marchingcubes]<br />
 			[example:webgl_materials_envmaps webgl / materials / envmaps]<br />
 			[example:webgl_materials_lightmap webgl / materials / lightmap]<br />
-			[example:webgl_materials_parallaxmap webgl / materials / parallaxmap]<br />
 			[example:webgl_materials_wireframe webgl / materials / wireframe]<br />
 			[example:webgl_modifier_tessellation webgl / modifier / tessellation]<br />
 			[example:webgl_postprocessing_dof2 webgl / postprocessing / dof2]<br />

+ 0 - 1
examples/files.json

@@ -145,7 +145,6 @@
 		"webgl_materials_matcap",
 		"webgl_materials_normalmap",
 		"webgl_materials_normalmap_object_space",
-		"webgl_materials_parallaxmap",
 		"webgl_materials_physical_clearcoat",
 		"webgl_materials_physical_reflectivity",
 		"webgl_materials_physical_sheen",

+ 0 - 198
examples/js/shaders/ParallaxShader.js

@@ -1,198 +0,0 @@
-( function () {
-
-	// Parallax Occlusion shaders from
-	//    http://sunandblackcat.com/tipFullView.php?topicid=28
-	// No tangent-space transforms logic based on
-	//   http://mmikkelsen3d.blogspot.sk/2012/02/parallaxpoc-mapping-and-no-tangent.html
-	const ParallaxShader = {
-		// Ordered from fastest to best quality.
-		modes: {
-			none: 'NO_PARALLAX',
-			basic: 'USE_BASIC_PARALLAX',
-			steep: 'USE_STEEP_PARALLAX',
-			occlusion: 'USE_OCLUSION_PARALLAX',
-			// a.k.a. POM
-			relief: 'USE_RELIEF_PARALLAX'
-		},
-		uniforms: {
-			'bumpMap': {
-				value: null
-			},
-			'map': {
-				value: null
-			},
-			'parallaxScale': {
-				value: null
-			},
-			'parallaxMinLayers': {
-				value: null
-			},
-			'parallaxMaxLayers': {
-				value: null
-			}
-		},
-		vertexShader:
-  /* glsl */
-  `
-
-		varying vec2 vUv;
-		varying vec3 vViewPosition;
-		varying vec3 vNormal;
-
-		void main() {
-
-			vUv = uv;
-			vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
-			vViewPosition = -mvPosition.xyz;
-			vNormal = normalize( normalMatrix * normal );
-			gl_Position = projectionMatrix * mvPosition;
-
-		}`,
-		fragmentShader:
-  /* glsl */
-  `
-
-		uniform sampler2D bumpMap;
-		uniform sampler2D map;
-
-		uniform float parallaxScale;
-		uniform float parallaxMinLayers;
-		uniform float parallaxMaxLayers;
-
-		varying vec2 vUv;
-		varying vec3 vViewPosition;
-		varying vec3 vNormal;
-
-		#ifdef USE_BASIC_PARALLAX
-
-			vec2 parallaxMap( in vec3 V ) {
-
-				float initialHeight = texture2D( bumpMap, vUv ).r;
-
-				// No Offset Limitting: messy, floating output at grazing angles.
-			//"vec2 texCoordOffset = parallaxScale * V.xy / V.z * initialHeight;",
-
-			// Offset Limiting
-				vec2 texCoordOffset = parallaxScale * V.xy * initialHeight;
-				return vUv - texCoordOffset;
-
-			}
-
-		#else
-
-			vec2 parallaxMap( in vec3 V ) {
-
-				// Determine number of layers from angle between V and N
-				float numLayers = mix( parallaxMaxLayers, parallaxMinLayers, abs( dot( vec3( 0.0, 0.0, 1.0 ), V ) ) );
-
-				float layerHeight = 1.0 / numLayers;
-				float currentLayerHeight = 0.0;
-				// Shift of texture coordinates for each iteration
-				vec2 dtex = parallaxScale * V.xy / V.z / numLayers;
-
-				vec2 currentTextureCoords = vUv;
-
-				float heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-
-				// while ( heightFromTexture > currentLayerHeight )
-				// Infinite loops are not well supported. Do a "large" finite
-				// loop, but not too large, as it slows down some compilers.
-				for ( int i = 0; i < 30; i += 1 ) {
-					if ( heightFromTexture <= currentLayerHeight ) {
-						break;
-					}
-					currentLayerHeight += layerHeight;
-					// Shift texture coordinates along vector V
-					currentTextureCoords -= dtex;
-					heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-				}
-
-				#ifdef USE_STEEP_PARALLAX
-
-					return currentTextureCoords;
-
-				#elif defined( USE_RELIEF_PARALLAX )
-
-					vec2 deltaTexCoord = dtex / 2.0;
-					float deltaHeight = layerHeight / 2.0;
-
-					// Return to the mid point of previous layer
-					currentTextureCoords += deltaTexCoord;
-					currentLayerHeight -= deltaHeight;
-
-					// Binary search to increase precision of Steep Parallax Mapping
-					const int numSearches = 5;
-					for ( int i = 0; i < numSearches; i += 1 ) {
-
-						deltaTexCoord /= 2.0;
-						deltaHeight /= 2.0;
-						heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-						// Shift along or against vector V
-						if( heightFromTexture > currentLayerHeight ) { // Below the surface
-
-							currentTextureCoords -= deltaTexCoord;
-							currentLayerHeight += deltaHeight;
-
-						} else { // above the surface
-
-							currentTextureCoords += deltaTexCoord;
-							currentLayerHeight -= deltaHeight;
-
-						}
-
-					}
-					return currentTextureCoords;
-
-				#elif defined( USE_OCLUSION_PARALLAX )
-
-					vec2 prevTCoords = currentTextureCoords + dtex;
-
-					// Heights for linear interpolation
-					float nextH = heightFromTexture - currentLayerHeight;
-					float prevH = texture2D( bumpMap, prevTCoords ).r - currentLayerHeight + layerHeight;
-
-					// Proportions for linear interpolation
-					float weight = nextH / ( nextH - prevH );
-
-					// Interpolation of texture coordinates
-					return prevTCoords * weight + currentTextureCoords * ( 1.0 - weight );
-
-				#else // NO_PARALLAX
-
-					return vUv;
-
-				#endif
-
-			}
-		#endif
-
-		vec2 perturbUv( vec3 surfPosition, vec3 surfNormal, vec3 viewPosition ) {
-
- 			vec2 texDx = dFdx( vUv );
-			vec2 texDy = dFdy( vUv );
-
-			vec3 vSigmaX = dFdx( surfPosition );
-			vec3 vSigmaY = dFdy( surfPosition );
-			vec3 vR1 = cross( vSigmaY, surfNormal );
-			vec3 vR2 = cross( surfNormal, vSigmaX );
-			float fDet = dot( vSigmaX, vR1 );
-
-			vec2 vProjVscr = ( 1.0 / fDet ) * vec2( dot( vR1, viewPosition ), dot( vR2, viewPosition ) );
-			vec3 vProjVtex;
-			vProjVtex.xy = texDx * vProjVscr.x + texDy * vProjVscr.y;
-			vProjVtex.z = dot( surfNormal, viewPosition );
-
-			return parallaxMap( vProjVtex );
-		}
-
-		void main() {
-
-			vec2 mapUv = perturbUv( -vViewPosition, normalize( vNormal ), normalize( vViewPosition ) );
-			gl_FragColor = texture2D( map, mapUv );
-
-		}`
-	};
-
-	THREE.ParallaxShader = ParallaxShader;
-
-} )();

+ 0 - 184
examples/jsm/shaders/ParallaxShader.js

@@ -1,184 +0,0 @@
-// Parallax Occlusion shaders from
-//    http://sunandblackcat.com/tipFullView.php?topicid=28
-// No tangent-space transforms logic based on
-//   http://mmikkelsen3d.blogspot.sk/2012/02/parallaxpoc-mapping-and-no-tangent.html
-
-const ParallaxShader = {
-	// Ordered from fastest to best quality.
-	modes: {
-		none: 'NO_PARALLAX',
-		basic: 'USE_BASIC_PARALLAX',
-		steep: 'USE_STEEP_PARALLAX',
-		occlusion: 'USE_OCLUSION_PARALLAX', // a.k.a. POM
-		relief: 'USE_RELIEF_PARALLAX'
-	},
-
-	uniforms: {
-		'bumpMap': { value: null },
-		'map': { value: null },
-		'parallaxScale': { value: null },
-		'parallaxMinLayers': { value: null },
-		'parallaxMaxLayers': { value: null }
-	},
-
-	vertexShader: /* glsl */`
-
-		varying vec2 vUv;
-		varying vec3 vViewPosition;
-		varying vec3 vNormal;
-
-		void main() {
-
-			vUv = uv;
-			vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
-			vViewPosition = -mvPosition.xyz;
-			vNormal = normalize( normalMatrix * normal );
-			gl_Position = projectionMatrix * mvPosition;
-
-		}`,
-
-	fragmentShader: /* glsl */`
-
-		uniform sampler2D bumpMap;
-		uniform sampler2D map;
-
-		uniform float parallaxScale;
-		uniform float parallaxMinLayers;
-		uniform float parallaxMaxLayers;
-
-		varying vec2 vUv;
-		varying vec3 vViewPosition;
-		varying vec3 vNormal;
-
-		#ifdef USE_BASIC_PARALLAX
-
-			vec2 parallaxMap( in vec3 V ) {
-
-				float initialHeight = texture2D( bumpMap, vUv ).r;
-
-				// No Offset Limitting: messy, floating output at grazing angles.
-			//"vec2 texCoordOffset = parallaxScale * V.xy / V.z * initialHeight;",
-
-			// Offset Limiting
-				vec2 texCoordOffset = parallaxScale * V.xy * initialHeight;
-				return vUv - texCoordOffset;
-
-			}
-
-		#else
-
-			vec2 parallaxMap( in vec3 V ) {
-
-				// Determine number of layers from angle between V and N
-				float numLayers = mix( parallaxMaxLayers, parallaxMinLayers, abs( dot( vec3( 0.0, 0.0, 1.0 ), V ) ) );
-
-				float layerHeight = 1.0 / numLayers;
-				float currentLayerHeight = 0.0;
-				// Shift of texture coordinates for each iteration
-				vec2 dtex = parallaxScale * V.xy / V.z / numLayers;
-
-				vec2 currentTextureCoords = vUv;
-
-				float heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-
-				// while ( heightFromTexture > currentLayerHeight )
-				// Infinite loops are not well supported. Do a "large" finite
-				// loop, but not too large, as it slows down some compilers.
-				for ( int i = 0; i < 30; i += 1 ) {
-					if ( heightFromTexture <= currentLayerHeight ) {
-						break;
-					}
-					currentLayerHeight += layerHeight;
-					// Shift texture coordinates along vector V
-					currentTextureCoords -= dtex;
-					heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-				}
-
-				#ifdef USE_STEEP_PARALLAX
-
-					return currentTextureCoords;
-
-				#elif defined( USE_RELIEF_PARALLAX )
-
-					vec2 deltaTexCoord = dtex / 2.0;
-					float deltaHeight = layerHeight / 2.0;
-
-					// Return to the mid point of previous layer
-					currentTextureCoords += deltaTexCoord;
-					currentLayerHeight -= deltaHeight;
-
-					// Binary search to increase precision of Steep Parallax Mapping
-					const int numSearches = 5;
-					for ( int i = 0; i < numSearches; i += 1 ) {
-
-						deltaTexCoord /= 2.0;
-						deltaHeight /= 2.0;
-						heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;
-						// Shift along or against vector V
-						if( heightFromTexture > currentLayerHeight ) { // Below the surface
-
-							currentTextureCoords -= deltaTexCoord;
-							currentLayerHeight += deltaHeight;
-
-						} else { // above the surface
-
-							currentTextureCoords += deltaTexCoord;
-							currentLayerHeight -= deltaHeight;
-
-						}
-
-					}
-					return currentTextureCoords;
-
-				#elif defined( USE_OCLUSION_PARALLAX )
-
-					vec2 prevTCoords = currentTextureCoords + dtex;
-
-					// Heights for linear interpolation
-					float nextH = heightFromTexture - currentLayerHeight;
-					float prevH = texture2D( bumpMap, prevTCoords ).r - currentLayerHeight + layerHeight;
-
-					// Proportions for linear interpolation
-					float weight = nextH / ( nextH - prevH );
-
-					// Interpolation of texture coordinates
-					return prevTCoords * weight + currentTextureCoords * ( 1.0 - weight );
-
-				#else // NO_PARALLAX
-
-					return vUv;
-
-				#endif
-
-			}
-		#endif
-
-		vec2 perturbUv( vec3 surfPosition, vec3 surfNormal, vec3 viewPosition ) {
-
- 			vec2 texDx = dFdx( vUv );
-			vec2 texDy = dFdy( vUv );
-
-			vec3 vSigmaX = dFdx( surfPosition );
-			vec3 vSigmaY = dFdy( surfPosition );
-			vec3 vR1 = cross( vSigmaY, surfNormal );
-			vec3 vR2 = cross( surfNormal, vSigmaX );
-			float fDet = dot( vSigmaX, vR1 );
-
-			vec2 vProjVscr = ( 1.0 / fDet ) * vec2( dot( vR1, viewPosition ), dot( vR2, viewPosition ) );
-			vec3 vProjVtex;
-			vProjVtex.xy = texDx * vProjVscr.x + texDy * vProjVscr.y;
-			vProjVtex.z = dot( surfNormal, viewPosition );
-
-			return parallaxMap( vProjVtex );
-		}
-
-		void main() {
-
-			vec2 mapUv = perturbUv( -vViewPosition, normalize( vNormal ), normalize( vViewPosition ) );
-			gl_FragColor = texture2D( map, mapUv );
-
-		}`
-
-};
-
-export { ParallaxShader };

BIN
examples/screenshots/webgl_materials_parallaxmap.jpg


+ 0 - 158
examples/webgl_materials_parallaxmap.html

@@ -1,158 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-	<head>
-		<title>three.js webgl - parallax mapping</title>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<link type="text/css" rel="stylesheet" href="main.css">
-	</head>
-	<body>
-
-		<div id="info">
-			<a href="https://threejs.org">Three.js</a> parallax mapping <br />
-			Original shaders authors:
-			<a href="http://sunandblackcat.com/tipFullView.php?topicid=28">Igor Dyhta</a>,
-			<a href="http://mmikkelsen3d.blogspot.sk/2012/02/parallaxpoc-mapping-and-no-tangent.html">Morten S. Mikkelsen</a><br />
-			Texture by <a href="http://agf81.deviantart.com/">AGF81</a>
-		</div>
-
-		<script type="module">
-
-			import * as THREE from '../build/three.module.js';
-
-			import Stats from './jsm/libs/stats.module.js';
-
-			import { GUI } from './jsm/libs/dat.gui.module.js';
-			import { OrbitControls } from './jsm/controls/OrbitControls.js';
-			import { ParallaxShader } from './jsm/shaders/ParallaxShader.js';
-
-			let camera, scene, material, renderer, stats;
-
-			const effectController = {
-				'mode': 'relief',
-				'scale': 0.005,
-				'minLayers': 20,
-				'maxLayers': 25
-			};
-
-			init();
-			initGUI();
-			animate();
-
-			function init() {
-
-				const container = document.createElement( 'div' );
-				document.body.appendChild( container );
-
-				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.01, 10 );
-				camera.position.z = 2;
-				scene = new THREE.Scene();
-
-				//
-
-				const shader = ParallaxShader;
-				const uniforms = THREE.UniformsUtils.clone( shader.uniforms );
-				const parameters = {
-					fragmentShader: shader.fragmentShader,
-					vertexShader: shader.vertexShader,
-					uniforms: uniforms
-				};
-
-				//
-
-				const textureLoader = new THREE.TextureLoader();
-
-				material = new THREE.ShaderMaterial( parameters );
-				material.map = textureLoader.load( 'textures/brick_diffuse.jpg' );
-				material.bumpMap = textureLoader.load( 'textures/brick_bump.jpg' );
-				material.map.anisotropy = 4;
-				material.bumpMap.anisotropy = 4;
-				uniforms[ 'map' ].value = material.map;
-				uniforms[ 'bumpMap' ].value = material.bumpMap;
-
-				//
-
-				const geometry = new THREE.BoxGeometry( 1.0, 1.0, 1.0 );
-				const mesh = new THREE.Mesh( geometry, material );
-				scene.add( mesh );
-
-				//
-
-				renderer = new THREE.WebGLRenderer( { antialias: true } );
-				renderer.setPixelRatio( window.devicePixelRatio );
-				renderer.setSize( window.innerWidth, window.innerHeight );
-				container.appendChild( renderer.domElement );
-				renderer.outputEncoding = THREE.sRGBEncoding;
-
-				//
-
-				const controls = new OrbitControls( camera, renderer.domElement );
-				controls.minDistance = 1;
-				controls.maxDistance = 5;
-
-				//
-
-				stats = new Stats();
-				container.appendChild( stats.dom );
-
-				//
-
-				window.addEventListener( 'resize', onWindowResize );
-
-			}
-
-			function guiChanged() {
-
-				const uniforms = material.uniforms;
-
-				uniforms[ 'parallaxScale' ].value = - 1.0 * effectController.scale;
-				uniforms[ 'parallaxMinLayers' ].value = effectController.minLayers;
-				uniforms[ 'parallaxMaxLayers' ].value = effectController.maxLayers;
-
-				material.defines = {};
-				material.defines[ ParallaxShader.modes[ effectController.mode ] ] = '';
-				material.needsUpdate = true;
-
-			}
-
-			function initGUI() {
-
-				const gui = new GUI();
-
-				gui.add( effectController, 'mode', Object.keys( ParallaxShader.modes ) ).onChange( guiChanged );
-				gui.add( effectController, 'scale', 0.0, 0.015, 0.001 ).onChange( guiChanged );
-				gui.add( effectController, 'minLayers', 1.0, 30, 1 ).onChange( guiChanged );
-				gui.add( effectController, 'maxLayers', 1.0, 30, 1 ).onChange( guiChanged );
-
-				guiChanged();
-
-			}
-
-			function onWindowResize() {
-
-				camera.aspect = window.innerWidth / window.innerHeight;
-				camera.updateProjectionMatrix();
-
-				renderer.setSize( window.innerWidth, window.innerHeight );
-
-			}
-
-			function animate() {
-
-				requestAnimationFrame( animate );
-
-				render();
-				stats.update();
-
-			}
-
-			function render() {
-
-				renderer.render( scene, camera );
-
-			}
-
-		</script>
-
-	</body>
-</html>