diff --git a/examples/js/loaders/EquirectangularToCubeGenerator.js b/examples/js/loaders/EquirectangularToCubeGenerator.js index 841c714cbc786632ce96a9acd9e07a46d5dbcdad..d5f647147400fd287d3f1c6aee6be6a98f9e9a20 100644 --- a/examples/js/loaders/EquirectangularToCubeGenerator.js +++ b/examples/js/loaders/EquirectangularToCubeGenerator.js @@ -1,117 +1,7 @@ /** * @author Richard M. / https://github.com/richardmonette -* @author WestLangley / http://github.com/WestLangley */ -THREE.CubemapGenerator = function ( renderer ) { - - this.renderer = renderer; - -}; - -THREE.CubemapGenerator.prototype.fromEquirectangular = function ( texture, options ) { - - options = options || {}; - - var scene = new THREE.Scene(); - - var shader = { - - uniforms: { - tEquirect: { value: null }, - }, - - vertexShader: - - ` - varying vec3 vWorldDirection; - - //include - vec3 transformDirection( in vec3 dir, in mat4 matrix ) { - - return normalize( ( matrix * vec4( dir, 0.0 ) ).xyz ); - - } - - void main() { - - vWorldDirection = transformDirection( position, modelMatrix ); - - #include - #include - - } - `, - - fragmentShader: - - ` - uniform sampler2D tEquirect; - - varying vec3 vWorldDirection; - - //include - #define RECIPROCAL_PI 0.31830988618 - #define RECIPROCAL_PI2 0.15915494 - - void main() { - - vec3 direction = normalize( vWorldDirection ); - - vec2 sampleUV; - - sampleUV.y = asin( clamp( direction.y, - 1.0, 1.0 ) ) * RECIPROCAL_PI + 0.5; - - sampleUV.x = atan( direction.z, direction.x ) * RECIPROCAL_PI2 + 0.5; - - gl_FragColor = texture2D( tEquirect, sampleUV ); - - } - ` - }; - - var material = new THREE.ShaderMaterial( { - - type: 'CubemapFromEquirect', - - uniforms: THREE.UniformsUtils.clone( shader.uniforms ), - vertexShader: shader.vertexShader, - fragmentShader: shader.fragmentShader, - side: THREE.BackSide, - blending: THREE.NoBlending - - } ); - - material.uniforms.tEquirect.value = texture; - - var mesh = new THREE.Mesh( new THREE.BoxBufferGeometry( 5, 5, 5 ), material ); - - scene.add( mesh ); - - var resolution = options.resolution || 512; - - var params = { - type: texture.type, - format: texture.format, - encoding: texture.encoding, - generateMipmaps: ( options.generateMipmaps !== undefined ) ? options.generateMipmaps : texture.generateMipmaps, - minFilter: ( options.minFilter !== undefined ) ? options.minFilter : texture.minFilter, - magFilter: ( options.magFilter !== undefined ) ? options.magFilter : texture.magFilter - }; - - var camera = new THREE.CubeCamera( 1, 10, resolution, params ); - - camera.update( this.renderer, scene ); - - mesh.geometry.dispose(); - mesh.material.dispose(); - - return camera.renderTarget; - -}; - -// - THREE.EquirectangularToCubeGenerator = ( function () { var camera = new THREE.PerspectiveCamera( 90, 1, 0.1, 10 ); diff --git a/examples/jsm/loaders/EquirectangularToCubeGenerator.d.ts b/examples/jsm/loaders/EquirectangularToCubeGenerator.d.ts index 3bd06a2a99fc0e858e164200f30844e891405391..d11808c84044e01a053d761368ef4b7f731826b8 100644 --- a/examples/jsm/loaders/EquirectangularToCubeGenerator.d.ts +++ b/examples/jsm/loaders/EquirectangularToCubeGenerator.d.ts @@ -2,33 +2,16 @@ import { PixelFormat, Texture, TextureDataType, - TextureFilter, WebGLRenderer, WebGLRenderTargetCube } from '../../../src/Three'; -export interface CubemapGeneratorOptions { - resolution?: number; - generateMipmaps?: boolean; - magFilter?: TextureFilter; - minFilter?: TextureFilter; -} - export interface EquirectangularToCubeGeneratorOptions { resolution?: number; format?: PixelFormat; type?: TextureDataType; } -export class CubemapGenerator { - - constructor( renderer: WebGLRenderer ); - renderer: WebGLRenderer; - - fromEquirectangular( texture: Texture, options?: CubemapGeneratorOptions ): WebGLRenderTargetCube; - -} - export class EquirectangularToCubeGenerator { constructor( sourceTexture: Texture, options?: EquirectangularToCubeGeneratorOptions ); diff --git a/examples/jsm/loaders/EquirectangularToCubeGenerator.js b/examples/jsm/loaders/EquirectangularToCubeGenerator.js index 734b9ce298c9960fb91447a022bcbc069fc24de4..68b1764bc87ff17f3bb2a4a6bfa3673f0bb7f165 100644 --- a/examples/jsm/loaders/EquirectangularToCubeGenerator.js +++ b/examples/jsm/loaders/EquirectangularToCubeGenerator.js @@ -1,130 +1,18 @@ /** * @author Richard M. / https://github.com/richardmonette -* @author WestLangley / http://github.com/WestLangley */ import { BackSide, BoxBufferGeometry, - CubeCamera, Mesh, NoBlending, PerspectiveCamera, Scene, ShaderMaterial, - UniformsUtils, WebGLRenderTargetCube } from "../../../build/three.module.js"; -var CubemapGenerator = function ( renderer ) { - - this.renderer = renderer; - -}; - -CubemapGenerator.prototype.fromEquirectangular = function ( texture, options ) { - - options = options || {}; - - var scene = new Scene(); - - var shader = { - - uniforms: { - tEquirect: { value: null }, - }, - - vertexShader: - - ` - varying vec3 vWorldDirection; - - //include - vec3 transformDirection( in vec3 dir, in mat4 matrix ) { - - return normalize( ( matrix * vec4( dir, 0.0 ) ).xyz ); - - } - - void main() { - - vWorldDirection = transformDirection( position, modelMatrix ); - - #include - #include - - } - `, - - fragmentShader: - - ` - uniform sampler2D tEquirect; - - varying vec3 vWorldDirection; - - //include - #define RECIPROCAL_PI 0.31830988618 - #define RECIPROCAL_PI2 0.15915494 - - void main() { - - vec3 direction = normalize( vWorldDirection ); - - vec2 sampleUV; - - sampleUV.y = asin( clamp( direction.y, - 1.0, 1.0 ) ) * RECIPROCAL_PI + 0.5; - - sampleUV.x = atan( direction.z, direction.x ) * RECIPROCAL_PI2 + 0.5; - - gl_FragColor = texture2D( tEquirect, sampleUV ); - - } - ` - }; - - var material = new ShaderMaterial( { - - type: 'CubemapFromEquirect', - - uniforms: UniformsUtils.clone( shader.uniforms ), - vertexShader: shader.vertexShader, - fragmentShader: shader.fragmentShader, - side: BackSide, - blending: NoBlending - - } ); - - material.uniforms.tEquirect.value = texture; - - var mesh = new Mesh( new BoxBufferGeometry( 5, 5, 5 ), material ); - - scene.add( mesh ); - - var resolution = options.resolution || 512; - - var params = { - type: texture.type, - format: texture.format, - encoding: texture.encoding, - generateMipmaps: ( options.generateMipmaps !== undefined ) ? options.generateMipmaps : texture.generateMipmaps, - minFilter: ( options.minFilter !== undefined ) ? options.minFilter : texture.minFilter, - magFilter: ( options.magFilter !== undefined ) ? options.magFilter : texture.magFilter - }; - - var camera = new CubeCamera( 1, 10, resolution, params ); - - camera.update( this.renderer, scene ); - - mesh.geometry.dispose(); - mesh.material.dispose(); - - return camera.renderTarget; - -}; - -// - var EquirectangularToCubeGenerator = ( function () { var camera = new PerspectiveCamera( 90, 1, 0.1, 10 ); @@ -248,4 +136,4 @@ var EquirectangularToCubeGenerator = ( function () { } )(); -export { CubemapGenerator, EquirectangularToCubeGenerator }; +export { EquirectangularToCubeGenerator }; diff --git a/examples/webgl_materials_cubemap_dynamic.html b/examples/webgl_materials_cubemap_dynamic.html index 9febe2b9260c5268aaa84cf8f252a98e898fd7ca..4635c3fc860e525a65d34acb742f18d966e33819 100644 --- a/examples/webgl_materials_cubemap_dynamic.html +++ b/examples/webgl_materials_cubemap_dynamic.html @@ -14,8 +14,6 @@ import * as THREE from '../build/three.module.js'; - import { CubemapGenerator } from './jsm/loaders/EquirectangularToCubeGenerator.js'; - var camera, scene, renderer; var cube, sphere, torus, material; @@ -50,14 +48,12 @@ // background var options = { - resolution: 1024, - generateMipmaps: true, minFilter: THREE.LinearMipmapLinearFilter, magFilter: THREE.LinearFilter }; - scene.background = new CubemapGenerator( renderer ).fromEquirectangular( texture, options ); + scene.background = new THREE.WebGLRenderTargetCube( 1024, 1024, options ).fromEquirectangularTexture( renderer, texture ); //