|
54 | 54 | import { OrbitControls } from 'three/addons/controls/OrbitControls.js'; |
55 | 55 | import { RGBELoader } from 'three/addons/loaders/RGBELoader.js'; |
56 | 56 |
|
57 | | - import { GainMapLoader, HDRJPGLoader } from '@monogrid/gainmap-js'; |
| 57 | + import { HDRJPGLoader } from '@monogrid/gainmap-js'; |
58 | 58 |
|
59 | 59 | const params = { |
60 | 60 | envMap: 'HDR JPG', |
|
68 | 68 | let camera, scene, renderer, controls; |
69 | 69 | let torusMesh, planeMesh; |
70 | 70 | let hdrJpg, hdrJpgPMREMRenderTarget, hdrJpgEquirectangularMap; |
71 | | - let gainMap, gainMapPMREMRenderTarget, gainMapBackground; |
72 | 71 | let hdrPMREMRenderTarget, hdrEquirectangularMap; |
73 | 72 |
|
74 | | - |
| 73 | + |
75 | 74 | const fileSizes = {}; |
76 | 75 | const resolutions = {}; |
77 | 76 |
|
|
127 | 126 |
|
128 | 127 |
|
129 | 128 | hdrJpg = new HDRJPGLoader( renderer ) |
130 | | - .load( 'textures/gainmap/spruit_sunrise_4k.jpg', function ( ) { |
| 129 | + .load( 'textures/equirectangular/spruit_sunrise_4k.hdr.jpg', function ( ) { |
131 | 130 |
|
132 | 131 | resolutions[ 'HDR JPG' ] = hdrJpg.width + 'x' + hdrJpg.height; |
| 132 | + |
133 | 133 | displayStats( 'HDR JPG' ); |
134 | | - |
| 134 | + |
135 | 135 | hdrJpgEquirectangularMap = hdrJpg.renderTarget.texture; |
136 | 136 | hdrJpgPMREMRenderTarget = pmremGenerator.fromEquirectangular( hdrJpgEquirectangularMap ); |
137 | | - |
| 137 | + |
138 | 138 | hdrJpgEquirectangularMap.mapping = THREE.EquirectangularReflectionMapping; |
139 | 139 | hdrJpgEquirectangularMap.needsUpdate = true; |
140 | 140 |
|
|
143 | 143 | }, function ( progress ) { |
144 | 144 |
|
145 | 145 | fileSizes[ 'HDR JPG' ] = humanFileSize( progress.total ); |
146 | | - |
147 | | - } ); |
148 | | - |
149 | | - gainMap = new GainMapLoader( renderer ) |
150 | | - .load( [ |
151 | | - 'textures/gainmap/spruit_sunrise_4k.webp', |
152 | | - 'textures/gainmap/spruit_sunrise_4k-gainmap.webp', |
153 | | - 'textures/gainmap/spruit_sunrise_4k.json' |
154 | | - ], function ( ) { |
155 | | - |
156 | | - resolutions[ 'Webp Gain map (separate)' ] = gainMap.width + 'x' + gainMap.height; |
157 | | - |
158 | | - gainMapBackground = gainMap.renderTarget.texture; |
159 | | - gainMapPMREMRenderTarget = pmremGenerator.fromEquirectangular( gainMapBackground ); |
160 | | - |
161 | | - gainMapBackground.mapping = THREE.EquirectangularReflectionMapping; |
162 | | - gainMapBackground.needsUpdate = true; |
163 | | - |
164 | | - gainMap.dispose(); |
165 | | - |
166 | | - }, function ( progress ) { |
167 | | - |
168 | | - fileSizes[ 'Webp Gain map (separate)' ] = humanFileSize( progress.total ); |
169 | 146 |
|
170 | 147 | } ); |
171 | 148 |
|
172 | 149 | hdrEquirectangularMap = new RGBELoader() |
173 | | - .load( 'textures/gainmap/spruit_sunrise_1k.hdr', function ( ) { |
| 150 | + .load( 'textures/equirectangular/spruit_sunrise_1k.hdr', function ( ) { |
174 | 151 |
|
175 | 152 | resolutions[ 'HDR' ] = hdrEquirectangularMap.image.width + 'x' + hdrEquirectangularMap.image.height; |
176 | | - |
| 153 | + |
177 | 154 | hdrPMREMRenderTarget = pmremGenerator.fromEquirectangular( hdrEquirectangularMap ); |
178 | 155 |
|
179 | 156 | hdrEquirectangularMap.mapping = THREE.EquirectangularReflectionMapping; |
|
202 | 179 |
|
203 | 180 | const gui = new GUI(); |
204 | 181 |
|
205 | | - gui.add( params, 'envMap', [ 'HDR JPG', 'Webp Gain map (separate)', 'HDR' ] ).onChange( displayStats ); |
| 182 | + gui.add( params, 'envMap', [ 'HDR JPG', 'HDR' ] ).onChange( displayStats ); |
206 | 183 | gui.add( params, 'roughness', 0, 1, 0.01 ); |
207 | 184 | gui.add( params, 'metalness', 0, 1, 0.01 ); |
208 | 185 | gui.add( params, 'exposure', 0, 2, 0.01 ); |
209 | 186 | gui.add( params, 'debug' ); |
210 | 187 | gui.open(); |
211 | | - |
| 188 | + |
212 | 189 | function displayStats( value ) { |
213 | 190 |
|
214 | 191 | lbl.innerHTML = value + ' size : ' + fileSizes[ value ] + ', Resolution: ' + resolutions[ value ]; |
|
281 | 258 | pmremRenderTarget = hdrJpgPMREMRenderTarget; |
282 | 259 | equirectangularMap = hdrJpgEquirectangularMap; |
283 | 260 | break; |
284 | | - case 'Webp Gain map (separate)': |
285 | | - pmremRenderTarget = gainMapPMREMRenderTarget; |
286 | | - equirectangularMap = gainMapBackground; |
287 | | - break; |
288 | 261 | case 'HDR': |
289 | 262 | pmremRenderTarget = hdrPMREMRenderTarget; |
290 | 263 | equirectangularMap = hdrEquirectangularMap; |
|
0 commit comments