|
19 | 19 |
|
20 | 20 | import Stats from './jsm/libs/stats.module.js'; |
21 | 21 |
|
| 22 | + import { GUI } from './jsm/libs/dat.gui.module.js'; |
22 | 23 | import { TrackballControls } from './jsm/controls/TrackballControls.js'; |
23 | 24 | import { OBJLoader } from './jsm/loaders/OBJLoader.js'; |
24 | 25 | import { RGBELoader } from './jsm/loaders/RGBELoader.js'; |
|
101 | 102 |
|
102 | 103 | } ); |
103 | 104 |
|
104 | | - new RGBELoader() |
| 105 | + const environments = { |
| 106 | + |
| 107 | + 'Venice Sunset': { filename: 'venice_sunset_1k.hdr' }, |
| 108 | + 'Overpass': { filename: 'pedestrian_overpass_1k.hdr' } |
| 109 | + |
| 110 | + }; |
| 111 | + |
| 112 | + function loadEnvironment(name) { |
| 113 | + |
| 114 | + if ( environments[ name ].texture !== undefined ) { |
| 115 | + |
| 116 | + scene.background = environments[ name ].texture; |
| 117 | + scene.environment = environments[ name ].texture; |
| 118 | + return; |
| 119 | + |
| 120 | + } |
| 121 | + |
| 122 | + const filename = environments[ name ].filename; |
| 123 | + new RGBELoader() |
105 | 124 | .setDataType( THREE.UnsignedByteType ) |
106 | 125 | .setPath( 'textures/equirectangular/' ) |
107 | | - .load( 'venice_sunset_1k.hdr', function ( hdrEquirect ) { |
| 126 | + .load( filename, function ( hdrEquirect ) { |
108 | 127 |
|
109 | 128 | const hdrCubeRenderTarget = pmremGenerator.fromEquirectangular( hdrEquirect ); |
110 | 129 | hdrEquirect.dispose(); |
111 | | - pmremGenerator.dispose(); |
112 | 130 |
|
113 | 131 | scene.background = hdrCubeRenderTarget.texture; |
114 | 132 | scene.environment = hdrCubeRenderTarget.texture; |
| 133 | + environments[ name ].texture = hdrCubeRenderTarget.texture; |
115 | 134 |
|
116 | 135 | } ); |
117 | 136 |
|
| 137 | + } |
| 138 | + |
| 139 | + const params = { |
| 140 | + |
| 141 | + environment: Object.keys( environments )[ 0 ] |
| 142 | + |
| 143 | + }; |
| 144 | + loadEnvironment( params.environment ); |
| 145 | + |
| 146 | + const gui = new GUI(); |
| 147 | + gui.add( params, 'environment', Object.keys( environments ) ).onChange( function( value ) { |
| 148 | + |
| 149 | + loadEnvironment(value); |
| 150 | + |
| 151 | + } ); |
| 152 | + gui.open(); |
| 153 | + |
118 | 154 | const pmremGenerator = new THREE.PMREMGenerator( renderer ); |
119 | 155 | pmremGenerator.compileEquirectangularShader(); |
120 | 156 |
|
|
0 commit comments