Make equirectangular reflections / refractions backwards compatible.

docs/api/en/constants/Textures.html

@@ -15,8 +15,6 @@ <h2>Mapping Modes</h2>
 		THREE.UVMapping
 		THREE.CubeReflectionMapping
 		THREE.CubeRefractionMapping
-		THREE.EquirectangularReflectionMapping
-		THREE.EquirectangularRefractionMapping
 		THREE.CubeUVReflectionMapping
 		THREE.CubeUVRefractionMapping
 		</code>
@@ -31,12 +29,6 @@ <h2>Mapping Modes</h2>
 		use with a [page:CubeTexture CubeTexture], which is made up of six textures, one for each face of the cube.
 		[page:Constant CubeReflectionMapping] is the default for a [page:CubeTexture CubeTexture]. <br /><br />
 
-		[page:Constant EquirectangularReflectionMapping] and [page:Constant EquirectangularRefractionMapping]
-		are for use with an equirectangular environment map.  Also called a lat-long map, an equirectangular
-		texture represents a 360-degree view along the horizontal centerline, and a 180-degree view along the
-		vertical axis, with the top and bottom edges of the image corresponding to the north and south poles
-		of a mapped sphere.<br /><br />
-
 		See the [example:webgl_materials_envmaps materials / envmaps] example.
 		</p>
 

docs/api/en/materials/MeshBasicMaterial.html

@@ -106,7 +106,7 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p>
 			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
-			It is used with environment mapping modes [page:Textures THREE.CubeRefractionMapping] and [page:Textures THREE.EquirectangularRefractionMapping].
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			The refraction ratio should not exceed 1. Default is *0.98*.
 		</p>
 

docs/api/en/materials/MeshLambertMaterial.html

@@ -135,7 +135,7 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p>
 			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
-			It is used with environment mapping modes [page:Textures THREE.CubeRefractionMapping] and [page:Textures THREE.EquirectangularRefractionMapping].
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			The refraction ratio should not exceed 1. Default is *0.98*.
 		</p>
 

docs/api/en/materials/MeshPhongMaterial.html

@@ -193,7 +193,7 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p>
 			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
-			It is used with environment mapping modes [page:Textures THREE.CubeRefractionMapping] and [page:Textures THREE.EquirectangularRefractionMapping].
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			The refraction ratio should not exceed 1. Default is *0.98*.
 		</p>
 

docs/api/en/materials/MeshStandardMaterial.html

@@ -234,7 +234,7 @@ <h3>[property:Vector2 normalScale]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p>
 			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
-			It is used with environment mapping modes [page:Textures THREE.CubeRefractionMapping] and [page:Textures THREE.EquirectangularRefractionMapping].
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			The refraction ratio should not exceed 1. Default is *0.98*.
 		</p>
 

docs/api/zh/constants/Textures.html

@@ -17,8 +17,6 @@ <h2>映射模式</h2>
 		THREE.UVMapping
 		THREE.CubeReflectionMapping
 		THREE.CubeRefractionMapping
-		THREE.EquirectangularReflectionMapping
-		THREE.EquirectangularRefractionMapping
 		THREE.CubeUVReflectionMapping
 		THREE.CubeUVRefractionMapping
 		</code>
@@ -33,10 +31,6 @@ <h2>映射模式</h2>
 
 		对于[page:CubeTexture CubeTexture]来说，[page:Constant CubeReflectionMapping]是其默认值。<br /><br />
 
-		[page:Constant EquirectangularReflectionMapping] 和 [page:Constant EquirectangularRefractionMapping]
-		用于等距圆柱投影的环境贴图，也被叫做经纬线映射贴图。等距圆柱投影贴图表示沿着其水平中线360°的视角，以及沿着其垂直轴向180°的视角。贴图顶部和底部的边缘分别对应于它所映射的球体的北极和南极。
-		<br /><br />
-
 		请查看示例：[example:webgl_materials_envmaps materials / envmaps] 。
 	</p>
 

docs/api/zh/materials/MeshBasicMaterial.html

@@ -94,6 +94,8 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p> 空气的折射率（IOR）（约为1）除以材质的折射率。它与环境映射模式[page:Textures THREE.CubeRefractionMapping]
 			和[page:Textures THREE.EquirectangularRefractionMapping]一起使用。
+			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			折射率不应超过1。默认值为*0.98*。
 		</p>
 

docs/api/zh/materials/MeshLambertMaterial.html

@@ -115,6 +115,8 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p>空气的折射率（IOR）（约为1）除以材质的折射率。它与环境映射模式[page:Textures THREE.CubeRefractionMapping]
 			和[page:Textures THREE.EquirectangularRefractionMapping]一起使用。
+			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			折射率不应超过1。默认值为*0.98*。
 		</p>
 

docs/api/zh/materials/MeshPhongMaterial.html

@@ -151,6 +151,8 @@ <h3>[property:Float reflectivity]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p> 空气的折射率（IOR）（约为1）除以材质的折射率。它与环境映射模式[page:Textures THREE.CubeRefractionMapping]
 			和[page:Textures THREE.EquirectangularRefractionMapping]一起使用。
+			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			折射率不应超过1。默认值为*0.98*。
 		</p>
 

docs/api/zh/materials/MeshStandardMaterial.html

@@ -188,6 +188,8 @@ <h3>[property:Vector2 normalScale]</h3>
 		<h3>[property:Float refractionRatio]</h3>
 		<p> 空气的折射率（IOR）（约为1）除以材质的折射率。它与环境映射模式[page:Textures THREE.CubeRefractionMapping]
 			和[page:Textures THREE.EquirectangularRefractionMapping]一起使用。
+			The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material.
+			It is used with environment mapping mode [page:Textures THREE.CubeRefractionMapping].
 			折射率不应超过1。默认值为*0.98*。
 		</p>
 

examples/webgl_materials_envmaps.html

@@ -22,10 +22,8 @@
 			import { OrbitControls } from './jsm/controls/OrbitControls.js';
 
 			var controls, camera, scene, renderer;
-			var cameraCube, sceneCube;
 			var textureEquirec, textureCube;
-			var cubeMesh, sphereMesh;
-			var sphereMaterial;
+			var sphereMesh, sphereMaterial;
 
 			init();
 			animate();
@@ -36,12 +34,10 @@
 
 				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 100000 );
 				camera.position.set( 0, 0, 1000 );
-				cameraCube = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 100000 );
 
 				// SCENE
 
 				scene = new THREE.Scene();
-				sceneCube = new THREE.Scene();
 
 				// Lights
 
@@ -50,12 +46,10 @@
 
 				// Textures
 
-				var r = 'textures/cube/Bridge2/';
-				var urls = [ r + 'posx.jpg', r + 'negx.jpg',
-							 r + 'posy.jpg', r + 'negy.jpg',
-							 r + 'posz.jpg', r + 'negz.jpg' ];
+				var loader = new THREE.CubeTextureLoader();
+				loader.setPath( 'textures/cube/Bridge2/' );
 
-				textureCube = new THREE.CubeTextureLoader().load( urls );
+				textureCube = loader.load( [ 'posx.jpg', 'negx.jpg', 'posy.jpg', 'negy.jpg', 'posz.jpg', 'negz.jpg' ] );
 				textureCube.encoding = THREE.sRGBEncoding;
 
 				var textureLoader = new THREE.TextureLoader();
@@ -64,65 +58,22 @@
 				textureEquirec.mapping = THREE.EquirectangularReflectionMapping;
 				textureEquirec.encoding = THREE.sRGBEncoding;
 
-				// Materials
-
-				var equirectShader = THREE.ShaderLib[ 'equirect' ];
-
-				var equirectMaterial = new THREE.ShaderMaterial( {
-					uniforms: THREE.UniformsUtils.clone( equirectShader.uniforms ),
-					fragmentShader: equirectShader.fragmentShader,
-					vertexShader: equirectShader.vertexShader,
-					depthWrite: false,
-					side: THREE.BackSide
-				} );
-
-				equirectMaterial.uniforms[ 'tEquirect' ].value = textureEquirec;
-
-				// enable code injection for non-built-in material
-				Object.defineProperty( equirectMaterial, 'map', {
-
-					get: function () {
-
-						return this.uniforms.tEquirect.value;
-
-					}
-
-				} );
-
-				var cubeShader = THREE.ShaderLib[ 'cube' ];
-
-				var cubeMaterial = new THREE.ShaderMaterial( {
-					uniforms: THREE.UniformsUtils.clone( cubeShader.uniforms ),
-					fragmentShader: cubeShader.fragmentShader,
-					vertexShader: cubeShader.vertexShader,
-					depthWrite: false,
-					side: THREE.BackSide
-				} );
-
-				cubeMaterial.envMap = textureCube;
-
-				// Skybox
-
-				cubeMesh = new THREE.Mesh( new THREE.BoxBufferGeometry( 100, 100, 100 ), cubeMaterial );
-				sceneCube.add( cubeMesh );
+				scene.background = textureCube;
 
 				//
 
 				var geometry = new THREE.SphereBufferGeometry( 400.0, 48, 24 );
 				sphereMaterial = new THREE.MeshLambertMaterial( { envMap: textureCube } );
 				sphereMesh = new THREE.Mesh( geometry, sphereMaterial );
-
 				scene.add( sphereMesh );
 
 				//
 
 				renderer = new THREE.WebGLRenderer();
-				renderer.autoClear = false;
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				document.body.appendChild( renderer.domElement );
-
 				renderer.outputEncoding = THREE.sRGBEncoding;
+				document.body.appendChild( renderer.domElement );
 
 				//
 
@@ -135,16 +86,16 @@
 				var params = {
 					Cube: function () {
 
-						cubeMesh.material = cubeMaterial;
-						cubeMesh.visible = true;
+						scene.background = textureCube;
+
 						sphereMaterial.envMap = textureCube;
 						sphereMaterial.needsUpdate = true;
 
 					},
 					Equirectangular: function () {
 
-						cubeMesh.material = equirectMaterial;
-						cubeMesh.visible = true;
+						scene.background = textureEquirec;
+
 						sphereMaterial.envMap = textureEquirec;
 						sphereMaterial.needsUpdate = true;
 
@@ -183,9 +134,6 @@
 				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
 
-				cameraCube.aspect = window.innerWidth / window.innerHeight;
-				cameraCube.updateProjectionMatrix();
-
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 			}
@@ -203,9 +151,6 @@
 			function render() {
 
 				camera.lookAt( scene.position );
-				cameraCube.rotation.copy( camera.rotation );
-
-				renderer.render( sceneCube, cameraCube );
 				renderer.render( scene, camera );
 
 			}

examples/webgl_materials_envmaps_parallax.html

@@ -173,22 +173,6 @@
 
 						vec4 envMapColor = textureCubeUV( envMap, reflectVec, roughness );
 
-					#elif defined( ENVMAP_TYPE_EQUIREC )
-
-						vec2 sampleUV = equirectUv( reflectVec );
-
-						#ifdef TEXTURE_LOD_EXT
-
-							vec4 envMapColor = texture2DLodEXT( envMap, sampleUV, specularMIPLevel );
-
-						#else
-
-							vec4 envMapColor = texture2D( envMap, sampleUV, specularMIPLevel );
-
-						#endif
-
-						envMapColor.rgb = envMapTexelToLinear( envMapColor ).rgb;
-
 					#endif
 
 					return envMapColor.rgb * envMapIntensity;

src/Three.js

@@ -33,13 +33,14 @@ export { CompressedTexture } from './textures/CompressedTexture.js';
 export { CubeTexture } from './textures/CubeTexture.js';
 export { CanvasTexture } from './textures/CanvasTexture.js';
 export { DepthTexture } from './textures/DepthTexture.js';
+export { EquirectangularTexture } from './textures/EquirectangularTexture.js';
 export { Texture } from './textures/Texture.js';
 export * from './geometries/Geometries.js';
 export * from './materials/Materials.js';
 export { AnimationLoader } from './loaders/AnimationLoader.js';
 export { CompressedTextureLoader } from './loaders/CompressedTextureLoader.js';
-export { DataTextureLoader } from './loaders/DataTextureLoader.js';
 export { CubeTextureLoader } from './loaders/CubeTextureLoader.js';
+export { DataTextureLoader } from './loaders/DataTextureLoader.js';
 export { TextureLoader } from './loaders/TextureLoader.js';
 export { ObjectLoader } from './loaders/ObjectLoader.js';
 export { MaterialLoader } from './loaders/MaterialLoader.js';

src/renderers/WebGLCubeRenderTarget.js

@@ -1,5 +1,4 @@
 import { BackSide, NoBlending } from '../constants.js';
-import { Scene } from '../scenes/Scene.js';
 import { Mesh } from '../objects/Mesh.js';
 import { BoxBufferGeometry } from '../geometries/BoxGeometry.js';
 import { ShaderMaterial } from '../materials/ShaderMaterial.js';
@@ -24,6 +23,8 @@ function WebGLCubeRenderTarget( size, options, dummy ) {
 
 	WebGLRenderTarget.call( this, size, size, options );
 
+	this.texture.isWebGLCubeRenderTargetTexture = true; // HACK Why is texture not a CubeTexture?
+
 }
 
 WebGLCubeRenderTarget.prototype = Object.create( WebGLRenderTarget.prototype );
@@ -37,12 +38,6 @@ WebGLCubeRenderTarget.prototype.fromEquirectangularTexture = function ( renderer
 	this.texture.format = texture.format;
 	this.texture.encoding = texture.encoding;
 
-	this.texture.generateMipmaps = texture.generateMipmaps;
-	this.texture.minFilter = texture.minFilter;
-	this.texture.magFilter = texture.magFilter;
-
-	const scene = new Scene();
-
 	const shader = {
 
 		uniforms: {
@@ -89,6 +84,8 @@ WebGLCubeRenderTarget.prototype.fromEquirectangularTexture = function ( renderer
 		`
 	};
 
+	const geometry = new BoxBufferGeometry( 5, 5, 5 );
+
 	const material = new ShaderMaterial( {
 
 		name: 'CubemapFromEquirect',
@@ -103,12 +100,34 @@ WebGLCubeRenderTarget.prototype.fromEquirectangularTexture = function ( renderer
 
 	material.uniforms.tEquirect.value = texture;
 
-	const mesh = new Mesh( new BoxBufferGeometry( 5, 5, 5 ), material );
+	const mesh = new Mesh( geometry, material );
 
-	scene.add( mesh );
+	//
 
 	const camera = new CubeCamera( 1, 10, this );
-	camera.update( renderer, scene );
+	camera.updateMatrixWorld();
+
+	const currentRenderTarget = renderer.getRenderTarget();
+	const generateMipmaps = this.texture.generateMipmaps;
+
+	this.texture.generateMipmaps = false;
+
+	renderer.compile( mesh, camera );
+
+	for ( let i = 0; i < 6; i ++ ) {
+
+		if ( i === 5 ) this.texture.generateMipmaps = generateMipmaps;
+
+		const camera2 = camera.children[ i ];
+
+		mesh.modelViewMatrix.multiplyMatrices( camera2.matrixWorldInverse, mesh.matrixWorld );
+
+		renderer.setRenderTarget( this, i );
+		renderer.renderBufferDirect( camera2, null, geometry, material, mesh, null );
+
+	}
+
+	renderer.setRenderTarget( currentRenderTarget );
 
 	mesh.geometry.dispose();
 	mesh.material.dispose();