123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321 |
- import * as THREE from '../../../build/three.module.js';
- import { potpack } from '../libs/potpack.module.js';
- class ProgressiveLightMap {
- constructor( renderer, res = 1024 ) {
- this.renderer = renderer;
- this.res = res;
- this.lightMapContainers = [];
- this.compiled = false;
- this.scene = new THREE.Scene();
- this.scene.background = null;
- this.tinyTarget = new THREE.WebGLRenderTarget( 1, 1 );
- this.buffer1Active = false;
- this.firstUpdate = true;
- this.warned = false;
-
- const format = /(Android|iPad|iPhone|iPod)/g.test( navigator.userAgent ) ? THREE.HalfFloatType : THREE.FloatType;
- this.progressiveLightMap1 = new THREE.WebGLRenderTarget( this.res, this.res, { type: format } );
- this.progressiveLightMap2 = new THREE.WebGLRenderTarget( this.res, this.res, { type: format } );
-
- this.uvMat = new THREE.MeshPhongMaterial();
- this.uvMat.uniforms = {};
- this.uvMat.onBeforeCompile = ( shader ) => {
-
- shader.vertexShader =
- '#define USE_LIGHTMAP\n' +
- shader.vertexShader.slice( 0, - 1 ) +
- ' gl_Position = vec4((uv2 - 0.5) * 2.0, 1.0, 1.0); }';
-
- const bodyStart = shader.fragmentShader.indexOf( 'void main() {' );
- shader.fragmentShader =
- 'varying vec2 vUv2;\n' +
- shader.fragmentShader.slice( 0, bodyStart ) +
- ' uniform sampler2D previousShadowMap;\n uniform float averagingWindow;\n' +
- shader.fragmentShader.slice( bodyStart - 1, - 1 ) +
- `\nvec3 texelOld = texture2D(previousShadowMap, vUv2).rgb;
- gl_FragColor.rgb = mix(texelOld, gl_FragColor.rgb, 1.0/averagingWindow);
- }`;
-
- shader.uniforms.previousShadowMap = { value: this.progressiveLightMap1.texture };
- shader.uniforms.averagingWindow = { value: 100 };
- this.uvMat.uniforms = shader.uniforms;
-
- this.uvMat.userData.shader = shader;
- this.compiled = true;
- };
- }
-
- addObjectsToLightMap( objects ) {
-
- this.uv_boxes = []; const padding = 3 / this.res;
- for ( let ob = 0; ob < objects.length; ob ++ ) {
- const object = objects[ ob ];
-
- if ( object.isLight ) {
- this.scene.attach( object ); continue;
- }
- if ( ! object.geometry.hasAttribute( 'uv' ) ) {
- console.warn( 'All lightmap objects need UVs!' ); continue;
- }
- if ( this.blurringPlane == null ) {
- this._initializeBlurPlane( this.res, this.progressiveLightMap1 );
- }
-
- object.material.lightMap = this.progressiveLightMap2.texture;
- object.material.dithering = true;
- object.castShadow = true;
- object.receiveShadow = true;
- object.renderOrder = 1000 + ob;
-
-
- this.uv_boxes.push( { w: 1 + ( padding * 2 ),
- h: 1 + ( padding * 2 ), index: ob } );
- this.lightMapContainers.push( { basicMat: object.material, object: object } );
- this.compiled = false;
- }
-
- const dimensions = potpack( this.uv_boxes );
- this.uv_boxes.forEach( ( box ) => {
- const uv2 = objects[ box.index ].geometry.getAttribute( 'uv' ).clone();
- for ( let i = 0; i < uv2.array.length; i += uv2.itemSize ) {
- uv2.array[ i ] = ( uv2.array[ i ] + box.x + padding ) / dimensions.w;
- uv2.array[ i + 1 ] = ( uv2.array[ i + 1 ] + box.y + padding ) / dimensions.h;
- }
- objects[ box.index ].geometry.setAttribute( 'uv2', uv2 );
- objects[ box.index ].geometry.getAttribute( 'uv2' ).needsUpdate = true;
- } );
- }
-
- update( camera, blendWindow = 100, blurEdges = true ) {
- if ( this.blurringPlane == null ) {
- return;
- }
-
- const oldTarget = this.renderer.getRenderTarget();
-
- this.blurringPlane.visible = blurEdges;
-
- for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
- this.lightMapContainers[ l ].object.oldScene =
- this.lightMapContainers[ l ].object.parent;
- this.scene.attach( this.lightMapContainers[ l ].object );
- }
-
- if ( this.firstUpdate ) {
- this.renderer.setRenderTarget( this.tinyTarget );
- this.renderer.render( this.scene, camera );
- this.firstUpdate = false;
- }
-
- for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
- this.uvMat.uniforms.averagingWindow = { value: blendWindow };
- this.lightMapContainers[ l ].object.material = this.uvMat;
- this.lightMapContainers[ l ].object.oldFrustumCulled =
- this.lightMapContainers[ l ].object.frustumCulled;
- this.lightMapContainers[ l ].object.frustumCulled = false;
- }
-
- const activeMap = this.buffer1Active ? this.progressiveLightMap1 : this.progressiveLightMap2;
- const inactiveMap = this.buffer1Active ? this.progressiveLightMap2 : this.progressiveLightMap1;
-
- this.renderer.setRenderTarget( activeMap );
- this.uvMat.uniforms.previousShadowMap = { value: inactiveMap.texture };
- this.blurringPlane.material.uniforms.previousShadowMap = { value: inactiveMap.texture };
- this.buffer1Active = ! this.buffer1Active;
- this.renderer.render( this.scene, camera );
-
- for ( let l = 0; l < this.lightMapContainers.length; l ++ ) {
- this.lightMapContainers[ l ].object.frustumCulled =
- this.lightMapContainers[ l ].object.oldFrustumCulled;
- this.lightMapContainers[ l ].object.material = this.lightMapContainers[ l ].basicMat;
- this.lightMapContainers[ l ].object.oldScene.attach( this.lightMapContainers[ l ].object );
- }
-
- this.renderer.setRenderTarget( oldTarget );
- }
-
- showDebugLightmap( visible, position = undefined ) {
- if ( this.lightMapContainers.length == 0 ) {
- if ( ! this.warned ) {
- console.warn( 'Call this after adding the objects!' ); this.warned = true;
- }
- return;
- }
- if ( this.labelMesh == null ) {
- this.labelMaterial = new THREE.MeshBasicMaterial(
- { map: this.progressiveLightMap1.texture, side: THREE.DoubleSide } );
- this.labelPlane = new THREE.PlaneGeometry( 100, 100 );
- this.labelMesh = new THREE.Mesh( this.labelPlane, this.labelMaterial );
- this.labelMesh.position.y = 250;
- this.lightMapContainers[ 0 ].object.parent.add( this.labelMesh );
- }
- if ( position != undefined ) {
- this.labelMesh.position.copy( position );
- }
- this.labelMesh.visible = visible;
- }
-
- _initializeBlurPlane( res, lightMap = null ) {
- const blurMaterial = new THREE.MeshBasicMaterial();
- blurMaterial.uniforms = { previousShadowMap: { value: null },
- pixelOffset: { value: 1.0 / res },
- polygonOffset: true, polygonOffsetFactor: - 1, polygonOffsetUnits: 3.0 };
- blurMaterial.onBeforeCompile = ( shader ) => {
-
- shader.vertexShader =
- '#define USE_UV\n' +
- shader.vertexShader.slice( 0, - 1 ) +
- ' gl_Position = vec4((uv - 0.5) * 2.0, 1.0, 1.0); }';
-
- const bodyStart = shader.fragmentShader.indexOf( 'void main() {' );
- shader.fragmentShader =
- '#define USE_UV\n' +
- shader.fragmentShader.slice( 0, bodyStart ) +
- ' uniform sampler2D previousShadowMap;\n uniform float pixelOffset;\n' +
- shader.fragmentShader.slice( bodyStart - 1, - 1 ) +
- ` gl_FragColor.rgb = (
- texture2D(previousShadowMap, vUv + vec2( pixelOffset, 0.0 )).rgb +
- texture2D(previousShadowMap, vUv + vec2( 0.0 , pixelOffset)).rgb +
- texture2D(previousShadowMap, vUv + vec2( 0.0 , -pixelOffset)).rgb +
- texture2D(previousShadowMap, vUv + vec2(-pixelOffset, 0.0 )).rgb +
- texture2D(previousShadowMap, vUv + vec2( pixelOffset, pixelOffset)).rgb +
- texture2D(previousShadowMap, vUv + vec2(-pixelOffset, pixelOffset)).rgb +
- texture2D(previousShadowMap, vUv + vec2( pixelOffset, -pixelOffset)).rgb +
- texture2D(previousShadowMap, vUv + vec2(-pixelOffset, -pixelOffset)).rgb)/8.0;
- }`;
-
- shader.uniforms.previousShadowMap = { value: lightMap.texture };
- shader.uniforms.pixelOffset = { value: 0.5 / res };
- blurMaterial.uniforms = shader.uniforms;
-
- blurMaterial.userData.shader = shader;
- this.compiled = true;
- };
- this.blurringPlane = new THREE.Mesh( new THREE.PlaneBufferGeometry( 1, 1 ), blurMaterial );
- this.blurringPlane.name = 'Blurring Plane';
- this.blurringPlane.frustumCulled = false;
- this.blurringPlane.renderOrder = 0;
- this.blurringPlane.material.depthWrite = false;
- this.scene.add( this.blurringPlane );
- }
- }
- export { ProgressiveLightMap };
|