three-gpu-pathtracer 0.0.14 → 0.0.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +1004 -981
  3. package/build/index.module.js +7413 -6902
  4. package/build/index.module.js.map +1 -1
  5. package/build/index.umd.cjs +7446 -6933
  6. package/build/index.umd.cjs.map +1 -1
  7. package/package.json +73 -73
  8. package/src/core/DynamicPathTracingSceneGenerator.js +119 -119
  9. package/src/core/MaterialReducer.js +256 -256
  10. package/src/core/PathTracingRenderer.js +346 -346
  11. package/src/core/PathTracingSceneGenerator.js +69 -69
  12. package/src/core/QuiltPathTracingRenderer.js +223 -223
  13. package/src/detectors/CompatibilityDetector.js +38 -0
  14. package/src/detectors/MaterialCompileDetector.js +50 -0
  15. package/src/detectors/PrecisionDetector.js +85 -0
  16. package/src/detectors/PrecisionMaterial.js +160 -0
  17. package/src/index.js +40 -36
  18. package/src/materials/MaterialBase.js +56 -56
  19. package/src/materials/debug/GraphMaterial.js +243 -243
  20. package/src/materials/fullscreen/AlphaDisplayMaterial.js +50 -48
  21. package/src/materials/fullscreen/BlendMaterial.js +67 -67
  22. package/src/materials/fullscreen/DenoiseMaterial.js +142 -142
  23. package/src/materials/fullscreen/GradientMapMaterial.js +82 -0
  24. package/src/materials/pathtracing/LambertPathTracingMaterial.js +296 -296
  25. package/src/materials/pathtracing/PhysicalPathTracingMaterial.js +118 -196
  26. package/src/materials/pathtracing/glsl/attenuateHit.glsl.js +177 -179
  27. package/src/materials/pathtracing/glsl/cameraUtils.glsl.js +84 -81
  28. package/src/materials/pathtracing/glsl/directLightContribution.glsl.js +93 -0
  29. package/src/materials/pathtracing/glsl/getSurfaceRecord.glsl.js +323 -317
  30. package/src/materials/pathtracing/glsl/renderStructs.glsl.js +50 -0
  31. package/src/materials/pathtracing/glsl/traceScene.glsl.js +52 -54
  32. package/src/materials/surface/AmbientOcclusionMaterial.js +207 -207
  33. package/src/materials/surface/FogVolumeMaterial.js +23 -23
  34. package/src/objects/EquirectCamera.js +13 -13
  35. package/src/objects/PhysicalCamera.js +42 -28
  36. package/src/objects/PhysicalSpotLight.js +25 -14
  37. package/src/objects/ShapedAreaLight.js +22 -12
  38. package/src/shader/bsdf/bsdfSampling.glsl.js +499 -490
  39. package/src/shader/bsdf/fog.glsl.js +22 -23
  40. package/src/shader/bsdf/ggx.glsl.js +102 -102
  41. package/src/shader/bsdf/iridescence.glsl.js +135 -135
  42. package/src/shader/bsdf/sheen.glsl.js +98 -98
  43. package/src/shader/common/arraySamplerTexelFetch.glsl.js +25 -25
  44. package/src/shader/common/bvhAnyHit.glsl.js +76 -76
  45. package/src/shader/common/fresnel.glsl.js +98 -98
  46. package/src/shader/common/intersectShapes.glsl.js +62 -62
  47. package/src/shader/common/math.glsl.js +81 -81
  48. package/src/shader/common/utils.glsl.js +116 -116
  49. package/src/shader/rand/pcg.glsl.js +57 -57
  50. package/src/shader/rand/sobol.glsl.js +256 -256
  51. package/src/shader/sampling/equirectSampling.glsl.js +62 -62
  52. package/src/shader/sampling/lightSampling.glsl.js +223 -223
  53. package/src/shader/sampling/shapeSampling.glsl.js +86 -86
  54. package/src/shader/structs/cameraStruct.glsl.js +13 -13
  55. package/src/shader/structs/equirectStruct.glsl.js +13 -14
  56. package/src/shader/structs/fogMaterialBvh.glsl.js +62 -62
  57. package/src/shader/structs/lightsStruct.glsl.js +78 -78
  58. package/src/shader/structs/materialStruct.glsl.js +207 -207
  59. package/src/textures/GradientEquirectTexture.js +35 -35
  60. package/src/textures/ProceduralEquirectTexture.js +75 -75
  61. package/src/uniforms/AttributesTextureArray.js +35 -35
  62. package/src/uniforms/EquirectHdrInfoUniform.js +269 -277
  63. package/src/uniforms/FloatAttributeTextureArray.js +169 -169
  64. package/src/uniforms/IESProfilesTexture.js +100 -100
  65. package/src/uniforms/LightsInfoUniformStruct.js +212 -212
  66. package/src/uniforms/MaterialsTexture.js +503 -503
  67. package/src/uniforms/PhysicalCameraUniform.js +36 -36
  68. package/src/uniforms/RenderTarget2DArray.js +97 -97
  69. package/src/uniforms/utils.js +30 -30
  70. package/src/utils/BlurredEnvMapGenerator.js +116 -116
  71. package/src/utils/GeometryPreparationUtils.js +214 -214
  72. package/src/utils/IESLoader.js +325 -325
  73. package/src/utils/SobolNumberMapGenerator.js +80 -80
  74. package/src/utils/UVUnwrapper.js +101 -101
  75. package/src/utils/macroify.js +9 -9
  76. package/src/workers/PathTracingSceneWorker.js +42 -42
package/README.md CHANGED
@@ -1,981 +1,1004 @@
1
- # three-gpu-pathtracer
2
-
3
- [![npm version](https://img.shields.io/npm/v/three-gpu-pathtracer.svg?style=flat-square)](https://www.npmjs.com/package/three-gpu-pathtracer)
4
- [![build](https://img.shields.io/github/actions/workflow/status/gkjohnson/three-gpu-pathtracer/node.js.yml?style=flat-square&label=build&branch=main)](https://github.com/gkjohnson/three-gpu-pathtracer/actions)
5
- [![github](https://flat.badgen.net/badge/icon/github?icon=github&label)](https://github.com/gkjohnson/three-gpu-pathtracer/)
6
- [![twitter](https://flat.badgen.net/twitter/follow/garrettkjohnson)](https://twitter.com/garrettkjohnson)
7
- [![sponsors](https://img.shields.io/github/sponsors/gkjohnson?style=flat-square&color=1da1f2)](https://github.com/sponsors/gkjohnson/)
8
-
9
- ![](https://user-images.githubusercontent.com/734200/162287477-96696b18-890b-4c1b-8a73-d662e577cc48.png)
10
-
11
- Path tracing project using [three-mesh-bvh](https://github.com/gkjohnson/three-mesh-bvh) and WebGL 2 to accelerate high quality, physically based rendering on the GPU. Features include support for GGX surface model, material information, textures, normal maps, emission, environment maps, tiled rendering, and more!
12
-
13
- _More features and capabilities in progress!_
14
-
15
- # Examples
16
-
17
- **Setup**
18
-
19
- [Basic Setup Example](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/basic.html)
20
-
21
- **Beauty Demos**
22
-
23
- [Physically Based Materials](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/index.html)
24
-
25
- [Lego Models](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/lego.html)
26
-
27
- [Interior Scene](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/interior.html)
28
-
29
- [Depth of Field](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/depthOfField.html)
30
-
31
- **Features**
32
-
33
- [Skinned Geometry Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/skinnedMesh.html)
34
-
35
- [Morph Target Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/skinnedMesh.html#morphtarget)
36
-
37
- [Area Light Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/areaLight.html)
38
-
39
- [Spot Light Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/spotLights.html)
40
-
41
- [Volumetric Fog Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/fog.html)
42
-
43
- **Test Scenes**
44
-
45
- [Material Test Orb](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialBall.html)
46
-
47
- [Transmission Preset Orb](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialBall.html#transmission)
48
-
49
- [Model Viewer Fidelity Scene Comparisons](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/viewerTest.html)
50
-
51
- [Physical Material Database](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialDatabase.html)
52
-
53
- **Tools**
54
-
55
- [Animation Rendering](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/renderVideo.html)
56
-
57
- [Ambient Occlusion Material](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/aoRender.html)
58
-
59
- [Looking Glass Portrait Quilt Render](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/lkg.html)
60
-
61
-
62
- ## Running examples locally
63
-
64
- To run and modify the examples locally, make sure you have Node and NPM installed. Check the supported versions in [the test configuration](./.github/workflows/node.js.yml).
65
-
66
- In order to install dependencies, you will need `make` and a C++ compiler available.
67
-
68
- On Debian or Ubuntu, run `sudo apt install build-essential`. It should just work on MacOS.
69
-
70
- - To install dependencies, run `npm install`
71
- - To start the demos run `npm start`
72
- - Visit `http://localhost:1234/<demo-name.html>`
73
-
74
- # Use
75
-
76
- **Basic Renderer**
77
-
78
- ```js
79
- import * as THREE from 'three';
80
- import { FullScreenQuad } from 'three/examples/jsm/postprocessing/Pass.js';
81
- import {
82
- PathTracingSceneGenerator,
83
- PathTracingRenderer,
84
- PhysicalPathTracingMaterial,
85
- } from 'three-gpu-pathtracer';
86
-
87
- // init scene, renderer, camera, controls, etc
88
-
89
- renderer.outputEncoding = THREE.sRGBEncoding;
90
- renderer.toneMapping = THREE.ACESFilmicToneMapping;
91
-
92
- // initialize the path tracing material and renderer
93
- const ptMaterial = new PhysicalPathTracingMaterial();
94
- const ptRenderer = new PathTracingRenderer( renderer );
95
- ptRenderer.setSize( window.innerWidth, window.innerHeight );
96
- ptRenderer.camera = camera;
97
- ptRenderer.material = ptMaterial;
98
-
99
- // if rendering transparent background
100
- ptRenderer.alpha = true;
101
-
102
- // init quad for rendering to the canvas
103
- const fsQuad = new FullScreenQuad( new THREE.MeshBasicMaterial( {
104
- map: ptRenderer.target.texture,
105
-
106
- // if rendering transparent background
107
- blending: THREE.CustomBlending,
108
- } ) );
109
-
110
- // ensure scene matrices are up to date
111
- scene.updateMatrixWorld();
112
-
113
- // initialize the scene and update the material properties with the bvh, materials, etc
114
- const generator = new PathTracingSceneGenerator();
115
- const { bvh, textures, materials, lights } = generator.generate( scene );
116
-
117
- // update bvh and geometry attribute textures
118
- ptMaterial.bvh.updateFrom( bvh );
119
- ptMaterial.attributesArray.updateFrom(
120
- geometry.attributes.normal,
121
- geometry.attributes.tangent,
122
- geometry.attributes.uv,
123
- geometry.attributes.color,
124
- );
125
-
126
- // update materials and texture arrays
127
- ptMaterial.materialIndexAttribute.updateFrom( geometry.attributes.materialIndex );
128
- ptMaterial.textures.setTextures( renderer, 2048, 2048, textures );
129
- ptMaterial.materials.updateFrom( materials, textures );
130
-
131
- // update the lights
132
- ptMaterial.lights.updateFrom( lights );
133
-
134
- // set the environment map
135
- const texture = await new RGBELoader().setDataType( THREE.FloatType ).loadAsync( envMapUrl );
136
- ptRenderer.material.envMapInfo.updateFrom( texture );
137
-
138
- animate();
139
-
140
- // ...
141
-
142
- function animate() {
143
-
144
- // if the camera position changes call "ptRenderer.reset()"
145
-
146
- // update the camera and render one sample
147
- camera.updateMatrixWorld();
148
- ptRenderer.update();
149
-
150
- // if using alpha = true then the target texture will change every frame
151
- // so we must retrieve it before render.
152
- fsQuad.material.map = ptRenderer.target.texture;
153
-
154
- // copy the current state of the path tracer to canvas to display
155
- fsQuad.render( renderer );
156
-
157
- }
158
- ```
159
-
160
- **Blurred Environment Map**
161
-
162
- Using a pre blurred envioronment map can help improve frame convergence time at the cost of sharp environment reflections. If performance is concern then multiple importance sampling can be disabled and blurred environment map used.
163
-
164
- ```js
165
- import { BlurredEnvMapGenerator } from 'three-gpu-pathtracer';
166
-
167
- // ...
168
-
169
- const envMap = await new RGBELoader().setDataType( THREE.FloatType ).loadAsync( envMapUrl );
170
- const generator = new BlurredEnvMapGenerator( renderer );
171
- const blurredEnvMap = generator.generate( envMap, 0.35 );
172
-
173
- // render!
174
-
175
- ```
176
-
177
- ## Dynamic Scenes
178
-
179
- Using the dynamic scene generator the same, frequently updated scene can be converted into a single reusable geometry multiple times and BVH refit which greatly improves subsequent scene updates. See `DynamicPathTracingSceneGenerator` docs for more info.
180
-
181
- ```js
182
- import { DynamicPathTracingSceneGenerator } from 'three-gpu-pathtracer';
183
-
184
- // ... initialize scene etc
185
-
186
- const generator = new DynamicPathTracingSceneGenerator( scene );
187
- const { bvh, textures, materials } = generator.generate( scene );
188
-
189
- // ... update path tracer and render
190
- ```
191
-
192
- ## Asynchronous Scene Generation
193
-
194
- _NOTE WebWorker syntax is inconsistently supported across bundlers and sometimes not supported at all so the PathTracingSceneWorker class is not exported from the package root. If needed the code from src/worker can be copied and modified to accomodate a particular build process._
195
-
196
- ```js
197
- import { PathTracingSceneWorker } from 'three-gpu-pathtracer/src/workers/PathTracingSceneWorker.js';
198
-
199
- // ...
200
-
201
- // initialize the scene and update the material properties with the bvh, materials, etc
202
- const generator = new PathTracingSceneWorker();
203
- const { bvh, textures, materials, lights } = await generator.generate( scene );
204
-
205
- // ...
206
- ```
207
-
208
- # Exports
209
-
210
- ## PathTracingRenderer
211
-
212
- Utility class for tracking and rendering a path traced scene to a render target.
213
-
214
- ### .samples
215
-
216
- ```js
217
- readonly samples : Number
218
- ```
219
-
220
- Number of samples per pixel that have been rendered to the target.
221
-
222
- ### .target
223
-
224
- ```js
225
- readonly target : WebGLRenderTarget
226
- ```
227
-
228
- The target being rendered to. The size of the target is updated with `setSize` and is initialized to a FloatType texture.
229
-
230
- > **Note**
231
- > Target will swap render targets after every full sample when alpha is enabled.
232
-
233
- ### .camera
234
-
235
- ```js
236
- camera = null : Camera
237
- ```
238
-
239
- The camera to render with. The view offset of the camera will be updated every sample to enable anti aliasing.
240
-
241
- ### .material
242
-
243
- ```js
244
- material = null : ShaderMaterial
245
- ```
246
-
247
- The Path Tracing material to render. This is expected to be a full screen quad material that respects the "opacity" field for every pixel so samples can be accumulated over time. The material is also expected to have `cameraWorldMatrix` and `invProjectionMatrix` fields of type `Matrix4`.
248
-
249
- ### .tiles
250
-
251
- ```js
252
- tiles = ( 1, 1 ) : Vector2
253
- ```
254
-
255
- Number of tiles on x and y to render to. Can be used to improve the responsiveness of a page while still rendering a high resolution target.
256
-
257
- ### .stableNoise
258
-
259
- ```js
260
- stableNoise = false : Boolean
261
- ```
262
-
263
- Whether to reset the random seed to `0` when restarting the render. If true then a consistent random sample pattern will appear when moving the camera, for example.
264
-
265
- ### .stableTiles
266
-
267
- ```js
268
- stableTiles = true : Boolean
269
- ```
270
-
271
- Whether the initial tile is reset to the top left tile when moving the camera or if it should continue to shift every frame.
272
-
273
- ### .alpha
274
-
275
- ```js
276
- alpha = false : Boolean
277
- ```
278
-
279
- Whether to support rendering scenes with transparent backgrounds. When transparent backgrounds are used two extra render targets are used, custom blending is performed, and PathTracingRenderer.target will change on every completed sample.
280
-
281
- > **Note**
282
- > When a transparent background is used the material used for the final render to the canvas must use the same "premultipliedAlpha" setting as the canvas otherwise the final image may look incorrect.
283
-
284
- ### constructor
285
-
286
- ```js
287
- constructor( renderer : WebGLRenderer )
288
- ```
289
-
290
- ### .setSize
291
-
292
- ```js
293
- setSize( size : Vector2 ) : void
294
- ```
295
-
296
- Sets the size of the target to render to.
297
-
298
- ### .update
299
-
300
- ```js
301
- update()
302
- ```
303
-
304
- Renders a single sample to the target.
305
-
306
- ### .reset
307
-
308
- ```js
309
- reset() : void
310
- ```
311
-
312
- Resets and restarts the render from scratch.
313
-
314
- ## QuiltPathTracingRenderer
315
-
316
- Renderer that supports rendering to a quilt renderer to rendering on displays such as the Looking Glass display.
317
-
318
- ### .viewCount
319
-
320
- ```js
321
- viewCount = 48 : Number
322
- ```
323
-
324
- The number of views to be rendered. If this is less than the product of the quiltDimensions then there will be gaps at the end of the quilt.
325
-
326
- ### .quiltDimensions
327
- ```js
328
- quiltDimensions = Vector2( 8, 6 ) : Vector2
329
- ```
330
-
331
- The number of quilt patches in each dimension.
332
-
333
- ### .viewCone
334
- ```js
335
- viewCone = 35 * DEG2RAD : Number
336
- ```
337
-
338
- The total angle sweep for the camera views rendered across the quilt.
339
-
340
- ### .viewFoV
341
-
342
- ```js
343
- viewFoV = 14 * DEG2RAD : Number
344
- ```
345
-
346
- The camera field of view to render.
347
-
348
- ### .displayDistance
349
-
350
- ```js
351
- displayDistance = 1 : Number
352
- ```
353
-
354
- The distance of the viewer to the display.
355
-
356
- ### .displayAspect
357
-
358
- ```js
359
- displayAspect = 0.75 : Number
360
- ```
361
-
362
- The aspect ratio of the display.
363
-
364
- ### .setFromDisplayView
365
-
366
- ```js
367
- setFromDisplayView(
368
- displayDistance : Number,
369
- displayWidth : Number,
370
- displayHeight : Number,
371
- ) : void
372
- ```
373
-
374
- Updates the `displayDistance`, `displayAspect`, and the `viewFoV` from viewer and display information.
375
-
376
- ## PathTracingSceneGenerator
377
-
378
- Utility class for generating the set of data required for initializing the path tracing material with a bvh, geometry, materials, and textures.
379
-
380
- ### .generate
381
-
382
- ```js
383
- generate( scene : Object3D | Array<Object3D>, options = {} : Object ) : {
384
- bvh : MeshBVH,
385
- materials : Array<Material>,
386
- textures : Array<Texture>,
387
- lights : Array<Light>
388
- }
389
- ```
390
-
391
- Merges the geometry in the given scene with an additional "materialIndex" attribute that references the associated material array. Also produces a set of textures referenced by the scene materials.
392
-
393
- ## PathTracingSceneWorker
394
-
395
- _extends PathTracingSceneGenerator_
396
-
397
- See note in [Asyncronous Generation](#asynchronous-generation) use snippet.
398
-
399
- ### .generate
400
-
401
- ```js
402
- async generate( scene : Object3D | Array<Object3D>, options = {} : Object ) : {
403
- bvh : MeshBVH,
404
- materials : Array<Material>,
405
- textures : Array<Texture>,
406
- lights : Array<Light>
407
- }
408
- ```
409
-
410
- ### .dispose
411
-
412
- ```js
413
- dispose() : void
414
- ```
415
-
416
- ## PhysicalCamera
417
-
418
- _extends THREE.PerspectiveCamera_
419
-
420
- An extension of the three.js PerspectiveCamera with some other parameters associated with depth of field. These parameters otherwise do not affect the camera behavior are are for convenience of use with the PhysicalCameraUniform and pathtracer.
421
-
422
- ### .focusDistance
423
-
424
- ```js
425
- focusDistance = 25 : Number
426
- ```
427
-
428
- The distance from the camera in meters that everything is is perfect focus.
429
-
430
- ### .fStop
431
-
432
- ```js
433
- fStop = 1.4 : Number
434
- ```
435
-
436
- The fstop value of the camera. If this is changed then the `bokehSize` field is implicitly updated.
437
-
438
- ### .bokehSize
439
-
440
- ```js
441
- bokehSize : Number
442
- ```
443
-
444
- The bokeh size as derived from the fStop and focal length in millimeters. If this is set then the fStop is implicitly updated.
445
-
446
- ### .apertureBlades
447
-
448
- ```js
449
- apertureBlades = 0 : Number
450
- ```
451
-
452
- The number of sides / blades on the aperture.
453
-
454
- ### .apertureRotation
455
-
456
- ```js
457
- apertureRotation = 0 : Number
458
- ```
459
-
460
- The rotation of the aperture shape in radians.
461
-
462
- ### .anamorphicRatio
463
-
464
- ```js
465
- anamorphicRatio = 1 : Number
466
- ```
467
-
468
- The anamorphic ratio of the lens. A higher value will stretch the bokeh effect horizontally.
469
-
470
- ## EquirectCamera
471
-
472
- _extends THREE.Camera_
473
-
474
- A class indicating that the path tracer should render an equirectangular view. Does not work with three.js raster rendering.
475
-
476
- ## PhysicalSpotLight
477
-
478
- _extends THREE.SpotLight_
479
-
480
- ### .radius
481
-
482
- ```js
483
- radius = 0 : Number
484
- ```
485
-
486
- The radius of the spotlight surface. Increase this value to add softness to shadows.
487
-
488
- ### .iesTexture
489
-
490
- ```js
491
- iesTexture = null : Texture
492
- ```
493
-
494
- The loaded IES texture describing directional light intensity. These can be loaded with the `IESLoader`.
495
-
496
- Premade IES profiles can be downloaded from [ieslibrary.com]. And custom profiles can be generated using [CNDL](https://cndl.io/).
497
-
498
- ## ShapedAreaLight
499
-
500
- _extends THREE.RectAreaLight_
501
-
502
- ### .isCircular
503
-
504
- ```js
505
- isCircular = false : Boolean
506
- ```
507
-
508
- Whether the area light should be rendered as a circle or a rectangle.
509
-
510
- ## DynamicPathTracingSceneGenerator
511
-
512
- A variation of the path tracing scene generator intended for quickly regenerating a scene BVH representation that updates frequently. Ie those with animated objects or animated skinned geometry.
513
-
514
- In order to quickly update a dynamic scene the same BVH is reused across updates by refitting rather than regenerating. This is significantly faster but also results in a less optimal BVH after significant changes.
515
-
516
- If geometry or materials are added or removed from the scene then `reset` must be called.
517
-
518
- ### constructor
519
-
520
- ```js
521
- constructor( scene : Object3D | Array<Object3D> )
522
- ```
523
-
524
- Takes the scene to convert.
525
-
526
- ### .generate
527
-
528
- ```js
529
- generate() : {
530
- bvh : MeshBVH,
531
- materials : Array<Material>,
532
- textures : Array<Texture>
533
- }
534
- ```
535
-
536
- Generates and refits the bvh to the current scene state. The same bvh, materials, and textures objects are returns after the initial call until `reset` is called.
537
-
538
- ### .reset
539
-
540
- ```js
541
- reset() : void
542
- ```
543
-
544
- Resets the generator so a new BVH is generated. This must be called when geometry, objects, or materials are added or removed from the scene.
545
-
546
- ## IESLoader
547
-
548
- _extends Loader_
549
-
550
- Loader for loading and parsing IES profile data. Load and parse functions return a `DataTexture` with the profile contents.
551
-
552
- ## BlurredEnvMapGenerator
553
-
554
- Utility for generating a PMREM blurred environment map that can be used with the path tracer.
555
-
556
- ### constructor
557
-
558
- ```js
559
- constructor( renderer : WebGLRenderer )
560
- ```
561
-
562
- ### .generate
563
-
564
- ```js
565
- generate( texture : Texture, blur : Number ) : DataTexture
566
- ```
567
-
568
- Takes a texture to blur and the amount to blur it. Returns a new `DataTexture` that has been PMREM blurred environment map that can have distribution data generated for importance sampling.
569
-
570
- ### .dispose
571
-
572
- ```js
573
- dispose() : void
574
- ```
575
-
576
- Disposes of the temporary files and textures for generation.
577
-
578
- ## GradientEquirectTexture
579
-
580
- ### .exponent
581
-
582
- ```js
583
- exponent = 2 : Number
584
- ```
585
-
586
- ### .topColor
587
-
588
- ```js
589
- topColor = 0xffffff : Color
590
- ```
591
-
592
- ### .bottomColor
593
-
594
- ```js
595
- bottomColor = 0x000000 : Color
596
- ```
597
-
598
- ### constructor
599
-
600
- ```js
601
- constructor( resolution = 512 : Number )
602
- ```
603
-
604
- ### .update
605
-
606
- ```js
607
- update() : void
608
- ```
609
-
610
- ## MaterialBase
611
-
612
- _extends THREE.ShaderMaterial_
613
-
614
- Convenience base class that adds additional functions and implicitly adds object definitions for all uniforms of the shader to the object.
615
-
616
- ### .setDefine
617
-
618
- ```js
619
- setDefine( name : string, value = undefined : any ) : void
620
- ```
621
-
622
- Sets the define of the given name to the provided value. If the value is set to null or undefined then it is deleted from the defines of the material. If the define changed from the previous value then `Material.needsUpdate` is set to `true`.
623
-
624
- ## PhysicalPathTracingMaterial
625
-
626
- _extends MaterialBase_
627
-
628
- **Uniforms**
629
-
630
- ```js
631
- {
632
- // The number of ray bounces to test. Higher is better quality but slower performance.
633
- // TransmissiveBounces indicates the number of additional transparent or translucent surfaces
634
- // the ray can pass through.
635
- bounces = 3 : Number,
636
- transmissiveBounces = 10 : Number,
637
-
638
- // The number of additional transmissive ray bounces to allow on top of existing bounces for object opacity / transmission.
639
- transmissiveBounces = 5 : Number,
640
-
641
- // The physical camera parameters to use
642
- physicalCamera : PhysicalCameraUniform,
643
-
644
- // Geometry and BVH information
645
- bvh: MeshBVHUniformStruct,
646
- attributesArray: AttributesTextureArray,
647
- materialIndexAttribute: UIntVertexAttributeTexture,
648
- materials: MaterialsTexture,
649
- textures: RenderTarget2DArray,
650
-
651
- // Light information
652
- lights: LightsInfoUniformStruct,
653
- iesProfiles: IESProfilesTexture,
654
-
655
- // Environment Map information
656
- envMapInfo: EquirectHdrInfoUniform,
657
- environmentRotation: Matrix4,
658
- environmentIntensity = 1: Number,
659
-
660
- // background blur
661
- backgroundBlur = 0: Number,
662
-
663
- // Factor for alleviating bright pixels from rays that hit diffuse surfaces then
664
- // specular surfaces. Setting this higher alleviates fireflies but will remove some
665
- // specular caustics.
666
- filterGlossyFactor = 0: Number,
667
-
668
- // The equirectangular map to render as the background.
669
- backgroundMap = null: Texture,
670
-
671
- // The transparency to render the background with. Note that the "alpha" option
672
- // must be set to true on PathTracingRenderer for this field to work properly.
673
- backgroundAlpha: 1.0,
674
- }
675
- ```
676
-
677
- **Defines**
678
-
679
- ```js
680
- {
681
-
682
- // Whether to use multiple importance sampling to help the image converge more quickly.
683
- FEATURE_MIS = 1 : Number,
684
-
685
- // Whether to use russian roulette path termination. Path termination will kick in after
686
- // a minimum three bounces have been performed.
687
- FEATURE_RUSSIAN_ROULETTE = 1 : Number,
688
-
689
- }
690
- ```
691
-
692
- ## FogVolumeMaterial
693
-
694
- _extends MeshStandardMaterial_
695
-
696
- A material used for rendering fog-like volumes within the scene. The `color`, `emissive`, and `emissiveIntensity` fields are all used in the render.
697
-
698
- > *NOTE*
699
- > Since fog models many particles throughout the scene and cause many extra bounces fog materials can dramatically impact render time.
700
-
701
- ### .density
702
-
703
- The particulate density of the volume.
704
-
705
- ## DenoiseMaterial
706
-
707
- _extends MaterialBase_
708
-
709
- Denoise material based on [BrutPitt/glslSmartDeNoise](https://github.com/BrutPitt/glslSmartDeNoise) intended to be the final pass to the screen. Includes tonemapping and color space conversions.
710
-
711
- **Uniforms**
712
-
713
- ```js
714
- {
715
-
716
- // sigma - sigma Standard Deviation
717
- // kSigma - sigma coefficient
718
- // kSigma * sigma = radius of the circular kernel
719
- sigma = 5.0 : Number,
720
- kSigma = 1.0 : Number,
721
-
722
- // edge sharpening threshold
723
- threshold = 0.03 : Number,
724
-
725
- }
726
- ```
727
-
728
- ## RenderTarget2DArray
729
-
730
- _extends WebGLArrayRenderTarget_
731
-
732
- A convenience extension from `WebGLArrayRenderTarget` that affords easily creating a uniform texture array from an array of textures.
733
-
734
- ### .setTextures
735
-
736
- ```js
737
- setTextures(
738
- renderer : WebGLRenderer,
739
- width : Number,
740
- height : Number,
741
- textures : Array<Texture>
742
- ) : void
743
- ```
744
-
745
- Takes the rendering context to update the target for, the target dimensions of the texture array, and the array of textures to render into the 2D texture array. Every texture is stretched to the dimensions of the texture array at the same index they are provided in.
746
-
747
- ## PhysicalCameraUniform
748
-
749
- Uniform for storing the camera parameters for use with the shader.
750
-
751
- ### .updateFrom
752
-
753
- ```js
754
- updateFrom( camera : PerspectiveCamera | PhysicalCamera ) : void
755
- ```
756
-
757
- Copies all fields from the passed PhysicalCamera if available otherwise the defaults are used.
758
-
759
- ## AttributesTextureArray
760
-
761
- A combined texture array used to store normal, tangent, uv, and color attributes in the same texture sampler array rather than separate samplers. Necessary to save texture slots.
762
-
763
- Normals, tangents, uvs, and color attribute data are stored in the 1st, 2nd, 3rd, and 4th layers of the array respectively.
764
-
765
- ### .updateNormalAttribute
766
-
767
- ```js
768
- updateNormalAttribute( attr : BufferAttribute ) : void
769
- ```
770
-
771
- ### .updateTangentAttribute
772
-
773
- ```js
774
- updateTangentAttribute( attr : BufferAttribute ) : void
775
- ```
776
-
777
- ### .updateUvAttribute
778
-
779
- ```js
780
- updateUvAttribute( attr : BufferAttribute ) : void
781
- ```
782
-
783
- ### .updateColorAttribute
784
-
785
- ```js
786
- updateColorAttribute( attr : BufferAttribute ) : void
787
- ```
788
-
789
- ### .updateFrom
790
-
791
- ```js
792
- updateFrom(
793
- normal : BufferAttribute,
794
- tangent : BufferAttribute,
795
- uv : BufferAttribute,
796
- color : BufferAttribute
797
- ) : void
798
- ```
799
-
800
- ## MaterialsTexture
801
-
802
- _extends DataTexture_
803
-
804
- Helper texture uniform for encoding materials as texture data.
805
-
806
- ### .threeCompatibilityTransforms
807
-
808
- ```js
809
- threeCompatibilityTransforms = false : Boolean
810
- ```
811
-
812
- Three.js materials support only a single set of UV transforms in a certain fallback priority while the pathtracer supports a unique set of transforms per texture. Set this field to true in order to use the same uv transform handling as three.js materials.
813
-
814
- See fallback order documentation [here](https://threejs.org/docs/#api/en/textures/Texture.offset).
815
-
816
- ### .setMatte
817
-
818
- ```js
819
- setMatte( index : Number, matte : Boolean ) : void
820
- ```
821
-
822
- Sets whether or not the material of the given index is matte or not. When "true" the background is rendered in place of the material.
823
-
824
- ### .setCastShadow
825
-
826
- ```js
827
- setCastShadow( index : Number, enabled : Boolean ) : void
828
- ```
829
-
830
- Sets whether or not the material of the given index will cast shadows. When "false" materials will not cast shadows on diffuse surfaces but will still be reflected. This is a good setting for lighting enclosed interiors with environment lighting.
831
-
832
- ### .updateFrom
833
-
834
- ```js
835
- updateFrom( materials : Array<Material>, textures : Array<Texture> ) : void
836
- ```
837
-
838
- Updates the size and values of the texture to align with the provided set of materials and textures.
839
-
840
- The "matte" and "side" values must be updated explicitly.
841
-
842
- > **Note**
843
- > In order for volume transmission to work the "attenuationDistance" must be set to a value less than Infinity or "thickness" must be set to a value greater than 0.
844
-
845
- ## LightsInfoUniformStruct
846
-
847
- Helper uniform for encoding lights as texture data with count.
848
-
849
- ### .updateFrom
850
-
851
- ```js
852
- updateFrom( lights : Array<Light>, iesTextures = [] : Array<Texture> ) : void
853
- ```
854
-
855
- Updates the size and values of the texture to align with the provided set of lights and IES textures.
856
-
857
- ## EquirectHdrInfoUniform
858
-
859
- Stores the environment map contents along with the intensity distribution information to support multiple importance sampling.
860
-
861
- ### .updateFrom
862
-
863
- ```js
864
- updateFrom( environmentMap : Texture ) : void
865
- ```
866
-
867
- Takes an environment map to process into something usable by the path tracer. Is expected to be a DataTexture so the data can be read.
868
-
869
- ## Functions
870
-
871
- ### mergeMeshes
872
-
873
- ```js
874
- mergeMeshes( meshes : Array<Mesh> ) : {
875
- materials : Array<Material>,
876
- textures : Array<Textures>,
877
- geometry : BufferGeometry
878
- }
879
- ```
880
-
881
- Merges the set of meshes into a single geometry with a `materialIndex` vertex attribute included on the geometry identifying the associated material in the returned `materials` array.
882
-
883
- ## Shader Chunks
884
-
885
- **shaderMaterialSampling**
886
-
887
- Set of functions for performing material scatter and PDF sampling. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderMaterialSampling.js) for full list of functions.
888
-
889
- **shaderLightSampling**
890
-
891
- Set of functions for performing light sampling. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderLightSampling.js) for full list of functions.
892
-
893
- **shaderStructs**
894
-
895
- Material and light struct definition for use with uniforms. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderStructs.js) for full list of functions.
896
-
897
- **shaderUtils**
898
-
899
- Set of randomness and other light transport utilities for use in a shader. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderUtils.js) for full list of functions.
900
-
901
- # Gotchas
902
-
903
- - The project requires use of WebGL2.
904
- - All textures must use the same wrap and interpolation flags.
905
- - SpotLights, DirectionalLights, and PointLights are only supported with MIS.
906
- - Only MeshStandardMaterial and MeshPhysicalMaterial are supported.
907
- - Instanced geometry and interleaved buffers are not supported.
908
- - Emissive materials are supported but do not take advantage of MIS.
909
-
910
- # Screenshots
911
-
912
- ![](https://user-images.githubusercontent.com/734200/162584469-68e6df38-92da-4a13-b352-ca0bdea14548.png)
913
-
914
- <p align="center">
915
- <i>Sample materials</i>
916
- </p>
917
-
918
- ![](https://user-images.githubusercontent.com/734200/163835927-be75d2c0-f27b-4e4b-a3eb-2371043fa5e1.png)
919
-
920
- ![](https://user-images.githubusercontent.com/734200/163839431-ed75e64d-9ae4-4423-afca-55162a44873e.png)
921
-
922
- <p align="center">
923
- <i>"SD Macross City Standoff Diorama" scene by <a href="https://sketchfab.com/3d-models/sd-macross-city-standoff-diorama-b154220f7e7441799d6be2f7ff9658c7">tipatat</a></i>
924
- </p>
925
-
926
- ![](./docs/interior-scene-cropped.png)
927
-
928
- <p align="center">
929
- <i>"Interior Scene" model by <a href="https://sketchfab.com/3d-models/interior-scene-45ddbbc4c2dc4f8ca9ed99da9a78326a">Allay Design</a></i>
930
- </p>
931
-
932
- ![](https://user-images.githubusercontent.com/734200/161820794-df0da371-ee5c-4368-9e7b-5e7daf6cf3c7.png)
933
-
934
- ![](https://user-images.githubusercontent.com/734200/162550315-3cdabf40-3dea-4d7d-bcfc-eb543eea2d93.png)
935
-
936
- <p align="center">
937
- <i>Perseverance Rover, Ingenuity Helicopter models by <a href="https://mars.nasa.gov/resources/25042/mars-perseverance-rover-3d-model/">NASA / JPL-Caltech</a></i>
938
- </p>
939
-
940
- ![](https://user-images.githubusercontent.com/734200/161877900-566652e4-c799-4940-bccb-0c8f4cea5387.png)
941
-
942
- <p align="center">
943
- <i>Gelatinous Cube model by <a href="https://sketchfab.com/3d-models/gelatinous-cube-e08385238f4d4b59b012233a9fbdca21">glenatron</a></i>
944
- </p>
945
-
946
- ![](https://user-images.githubusercontent.com/734200/161822206-c27bf594-d648-4735-868e-4baf4e414802.png)
947
-
948
- ![](https://user-images.githubusercontent.com/734200/161822214-eace4297-03c4-4adc-b472-efe29a862685.png)
949
-
950
- <p align="center">
951
- <i>Lego models courtesy of the <a href="https://omr.ldraw.org/">LDraw Official Model Repository</a></i>
952
- </p>
953
-
954
- ![](https://user-images.githubusercontent.com/734200/161877196-7ae2769e-7e54-4694-9ca8-e8f5219d1c2d.png)
955
-
956
- <p align="center">
957
- <i>Octopus Tea model by <a href="https://sketchfab.com/3d-models/cartoon-octopus-takes-a-tea-bath-107260cf0fd24202a67eb037a6c760a5
958
- ">AzTiZ</a></i>
959
- </p>
960
-
961
- ![](https://user-images.githubusercontent.com/734200/173212652-de6a83e5-dd2c-49b5-8ed7-484ff8969b5b.png)
962
- <p align="center">
963
- <i>Botanists Study model by <a href="https://sketchfab.com/3d-models/the-botanists-study-8b7b5743b1c848ed8ea58f5518c44e7e">riikkakilpelainen</a></i>
964
- </p>
965
-
966
- ![](https://user-images.githubusercontent.com/734200/173170459-849b9343-efe3-4635-8719-346511472965.png)
967
- <p align="center">
968
- <i>Japanese Bridge Garden model by <a href="https://sketchfab.com/3d-models/japanese-bridge-garden-d122e17593eb4012913cde927486d15a">kristenlee</a></i>
969
- </p>
970
-
971
- ### Resources
972
-
973
- [Raytracing in One Weekend Book](https://raytracing.github.io/)
974
-
975
- [PBR Book](https://pbr-book.org/)
976
-
977
- [knightcrawler25/GLSL-PathTracer](https://github.com/knightcrawler25/GLSL-PathTracer/)
978
-
979
- [DassaultSystemes-Technology/dspbr-pt](https://github.com/DassaultSystemes-Technology/dspbr-pt)
980
-
981
-
1
+ # three-gpu-pathtracer
2
+
3
+ [![npm version](https://img.shields.io/npm/v/three-gpu-pathtracer.svg?style=flat-square)](https://www.npmjs.com/package/three-gpu-pathtracer)
4
+ [![build](https://img.shields.io/github/actions/workflow/status/gkjohnson/three-gpu-pathtracer/node.js.yml?style=flat-square&label=build&branch=main)](https://github.com/gkjohnson/three-gpu-pathtracer/actions)
5
+ [![github](https://flat.badgen.net/badge/icon/github?icon=github&label)](https://github.com/gkjohnson/three-gpu-pathtracer/)
6
+ [![twitter](https://flat.badgen.net/badge/twitter/@garrettkjohnson/?icon&label)](https://twitter.com/garrettkjohnson)
7
+ [![sponsors](https://img.shields.io/github/sponsors/gkjohnson?style=flat-square&color=1da1f2)](https://github.com/sponsors/gkjohnson/)
8
+
9
+ ![](https://user-images.githubusercontent.com/734200/162287477-96696b18-890b-4c1b-8a73-d662e577cc48.png)
10
+
11
+ Path tracing project using [three-mesh-bvh](https://github.com/gkjohnson/three-mesh-bvh) and WebGL 2 to accelerate high quality, physically based rendering on the GPU. Features include support for GGX surface model, material information, textures, normal maps, emission, environment maps, tiled rendering, and more!
12
+
13
+ _More features and capabilities in progress!_
14
+
15
+ # Examples
16
+
17
+ **Setup**
18
+
19
+ [Basic Setup Example](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/basic.html)
20
+
21
+ **Beauty Demos**
22
+
23
+ [Physically Based Materials](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/index.html)
24
+
25
+ [Lego Models](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/lego.html)
26
+
27
+ [Interior Scene](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/interior.html)
28
+
29
+ [Depth of Field](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/depthOfField.html)
30
+
31
+ **Features**
32
+
33
+ [Skinned Geometry Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/skinnedMesh.html)
34
+
35
+ [Morph Target Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/skinnedMesh.html#morphtarget)
36
+
37
+ [Area Light Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/areaLight.html)
38
+
39
+ [Spot Light Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/spotLights.html)
40
+
41
+ [Volumetric Fog Support](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/fog.html)
42
+
43
+ **Test Scenes**
44
+
45
+ [Material Test Orb](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialBall.html)
46
+
47
+ [Transmission Preset Orb](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialBall.html#transmission)
48
+
49
+ [Model Viewer Fidelity Scene Comparisons](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/viewerTest.html)
50
+
51
+ [Physical Material Database](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/materialDatabase.html)
52
+
53
+ **Tools**
54
+
55
+ [Animation Rendering](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/renderVideo.html)
56
+
57
+ [Ambient Occlusion Material](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/aoRender.html)
58
+
59
+ [Looking Glass Portrait Quilt Render](https://gkjohnson.github.io/three-gpu-pathtracer/example/bundle/lkg.html)
60
+
61
+
62
+ ## Running examples locally
63
+
64
+ To run and modify the examples locally, make sure you have Node and NPM installed. Check the supported versions in [the test configuration](./.github/workflows/node.js.yml).
65
+
66
+ In order to install dependencies, you will need `make` and a C++ compiler available.
67
+
68
+ On Debian or Ubuntu, run `sudo apt install build-essential`. It should just work on MacOS.
69
+
70
+ - To install dependencies, run `npm install`
71
+ - To start the demos run `npm start`
72
+ - Visit `http://localhost:1234/<demo-name.html>`
73
+
74
+ # Use
75
+
76
+ **Basic Renderer**
77
+
78
+ ```js
79
+ import * as THREE from 'three';
80
+ import { FullScreenQuad } from 'three/examples/jsm/postprocessing/Pass.js';
81
+ import {
82
+ PathTracingSceneGenerator,
83
+ PathTracingRenderer,
84
+ PhysicalPathTracingMaterial,
85
+ } from 'three-gpu-pathtracer';
86
+
87
+ // init scene, renderer, camera, controls, etc
88
+
89
+ renderer.outputEncoding = THREE.sRGBEncoding;
90
+ renderer.toneMapping = THREE.ACESFilmicToneMapping;
91
+
92
+ // initialize the path tracing material and renderer
93
+ const ptMaterial = new PhysicalPathTracingMaterial();
94
+ const ptRenderer = new PathTracingRenderer( renderer );
95
+ ptRenderer.setSize( window.innerWidth, window.innerHeight );
96
+ ptRenderer.camera = camera;
97
+ ptRenderer.material = ptMaterial;
98
+
99
+ // if rendering transparent background
100
+ ptRenderer.alpha = true;
101
+
102
+ // init quad for rendering to the canvas
103
+ const fsQuad = new FullScreenQuad( new THREE.MeshBasicMaterial( {
104
+ map: ptRenderer.target.texture,
105
+
106
+ // if rendering transparent background
107
+ blending: THREE.CustomBlending,
108
+ } ) );
109
+
110
+ // ensure scene matrices are up to date
111
+ scene.updateMatrixWorld();
112
+
113
+ // initialize the scene and update the material properties with the bvh, materials, etc
114
+ const generator = new PathTracingSceneGenerator();
115
+ const { bvh, textures, materials, lights } = generator.generate( scene );
116
+
117
+ // update bvh and geometry attribute textures
118
+ ptMaterial.bvh.updateFrom( bvh );
119
+ ptMaterial.attributesArray.updateFrom(
120
+ geometry.attributes.normal,
121
+ geometry.attributes.tangent,
122
+ geometry.attributes.uv,
123
+ geometry.attributes.color,
124
+ );
125
+
126
+ // update materials and texture arrays
127
+ ptMaterial.materialIndexAttribute.updateFrom( geometry.attributes.materialIndex );
128
+ ptMaterial.textures.setTextures( renderer, 2048, 2048, textures );
129
+ ptMaterial.materials.updateFrom( materials, textures );
130
+
131
+ // update the lights
132
+ ptMaterial.lights.updateFrom( lights );
133
+
134
+ // set the environment map
135
+ const texture = await new RGBELoader().setDataType( THREE.FloatType ).loadAsync( envMapUrl );
136
+ ptRenderer.material.envMapInfo.updateFrom( texture );
137
+
138
+ animate();
139
+
140
+ // ...
141
+
142
+ function animate() {
143
+
144
+ // if the camera position changes call "ptRenderer.reset()"
145
+
146
+ // update the camera and render one sample
147
+ camera.updateMatrixWorld();
148
+ ptRenderer.update();
149
+
150
+ // if using alpha = true then the target texture will change every frame
151
+ // so we must retrieve it before render.
152
+ fsQuad.material.map = ptRenderer.target.texture;
153
+
154
+ // copy the current state of the path tracer to canvas to display
155
+ fsQuad.render( renderer );
156
+
157
+ }
158
+ ```
159
+
160
+ **Blurred Environment Map**
161
+
162
+ Using a pre blurred envioronment map can help improve frame convergence time at the cost of sharp environment reflections. If performance is concern then multiple importance sampling can be disabled and blurred environment map used.
163
+
164
+ ```js
165
+ import { BlurredEnvMapGenerator } from 'three-gpu-pathtracer';
166
+
167
+ // ...
168
+
169
+ const envMap = await new RGBELoader().setDataType( THREE.FloatType ).loadAsync( envMapUrl );
170
+ const generator = new BlurredEnvMapGenerator( renderer );
171
+ const blurredEnvMap = generator.generate( envMap, 0.35 );
172
+
173
+ // render!
174
+
175
+ ```
176
+
177
+ ## Dynamic Scenes
178
+
179
+ Using the dynamic scene generator the same, frequently updated scene can be converted into a single reusable geometry multiple times and BVH refit which greatly improves subsequent scene updates. See `DynamicPathTracingSceneGenerator` docs for more info.
180
+
181
+ ```js
182
+ import { DynamicPathTracingSceneGenerator } from 'three-gpu-pathtracer';
183
+
184
+ // ... initialize scene etc
185
+
186
+ const generator = new DynamicPathTracingSceneGenerator( scene );
187
+ const { bvh, textures, materials } = generator.generate( scene );
188
+
189
+ // ... update path tracer and render
190
+ ```
191
+
192
+ ## Asynchronous Scene Generation
193
+
194
+ _NOTE WebWorker syntax is inconsistently supported across bundlers and sometimes not supported at all so the PathTracingSceneWorker class is not exported from the package root. If needed the code from src/worker can be copied and modified to accomodate a particular build process._
195
+
196
+ ```js
197
+ import { PathTracingSceneWorker } from 'three-gpu-pathtracer/src/workers/PathTracingSceneWorker.js';
198
+
199
+ // ...
200
+
201
+ // initialize the scene and update the material properties with the bvh, materials, etc
202
+ const generator = new PathTracingSceneWorker();
203
+ const { bvh, textures, materials, lights } = await generator.generate( scene );
204
+
205
+ // ...
206
+ ```
207
+
208
+ # Exports
209
+
210
+ ## PathTracingRenderer
211
+
212
+ Utility class for tracking and rendering a path traced scene to a render target.
213
+
214
+ ### .samples
215
+
216
+ ```js
217
+ readonly samples : Number
218
+ ```
219
+
220
+ Number of samples per pixel that have been rendered to the target.
221
+
222
+ ### .target
223
+
224
+ ```js
225
+ readonly target : WebGLRenderTarget
226
+ ```
227
+
228
+ The target being rendered to. The size of the target is updated with `setSize` and is initialized to a FloatType texture.
229
+
230
+ > **Note**
231
+ > Target will swap render targets after every full sample when alpha is enabled.
232
+
233
+ ### .camera
234
+
235
+ ```js
236
+ camera = null : Camera
237
+ ```
238
+
239
+ The camera to render with. The view offset of the camera will be updated every sample to enable anti aliasing.
240
+
241
+ ### .material
242
+
243
+ ```js
244
+ material = null : ShaderMaterial
245
+ ```
246
+
247
+ The Path Tracing material to render. This is expected to be a full screen quad material that respects the "opacity" field for every pixel so samples can be accumulated over time. The material is also expected to have `cameraWorldMatrix` and `invProjectionMatrix` fields of type `Matrix4`.
248
+
249
+ ### .tiles
250
+
251
+ ```js
252
+ tiles = ( 1, 1 ) : Vector2
253
+ ```
254
+
255
+ Number of tiles on x and y to render to. Can be used to improve the responsiveness of a page while still rendering a high resolution target.
256
+
257
+ ### .stableNoise
258
+
259
+ ```js
260
+ stableNoise = false : Boolean
261
+ ```
262
+
263
+ Whether to reset the random seed to `0` when restarting the render. If true then a consistent random sample pattern will appear when moving the camera, for example.
264
+
265
+ ### .stableTiles
266
+
267
+ ```js
268
+ stableTiles = true : Boolean
269
+ ```
270
+
271
+ Whether the initial tile is reset to the top left tile when moving the camera or if it should continue to shift every frame.
272
+
273
+ ### .alpha
274
+
275
+ ```js
276
+ alpha = false : Boolean
277
+ ```
278
+
279
+ Whether to support rendering scenes with transparent backgrounds. When transparent backgrounds are used two extra render targets are used, custom blending is performed, and PathTracingRenderer.target will change on every completed sample.
280
+
281
+ > **Note**
282
+ > When a transparent background is used the material used for the final render to the canvas must use the same "premultipliedAlpha" setting as the canvas otherwise the final image may look incorrect.
283
+
284
+ ### constructor
285
+
286
+ ```js
287
+ constructor( renderer : WebGLRenderer )
288
+ ```
289
+
290
+ ### .setSize
291
+
292
+ ```js
293
+ setSize( size : Vector2 ) : void
294
+ ```
295
+
296
+ Sets the size of the target to render to.
297
+
298
+ ### .update
299
+
300
+ ```js
301
+ update()
302
+ ```
303
+
304
+ Renders a single sample to the target.
305
+
306
+ ### .reset
307
+
308
+ ```js
309
+ reset() : void
310
+ ```
311
+
312
+ Resets and restarts the render from scratch.
313
+
314
+ ## QuiltPathTracingRenderer
315
+
316
+ Renderer that supports rendering to a quilt renderer to rendering on displays such as the Looking Glass display.
317
+
318
+ ### .viewCount
319
+
320
+ ```js
321
+ viewCount = 48 : Number
322
+ ```
323
+
324
+ The number of views to be rendered. If this is less than the product of the quiltDimensions then there will be gaps at the end of the quilt.
325
+
326
+ ### .quiltDimensions
327
+ ```js
328
+ quiltDimensions = Vector2( 8, 6 ) : Vector2
329
+ ```
330
+
331
+ The number of quilt patches in each dimension.
332
+
333
+ ### .viewCone
334
+ ```js
335
+ viewCone = 35 * DEG2RAD : Number
336
+ ```
337
+
338
+ The total angle sweep for the camera views rendered across the quilt.
339
+
340
+ ### .viewFoV
341
+
342
+ ```js
343
+ viewFoV = 14 * DEG2RAD : Number
344
+ ```
345
+
346
+ The camera field of view to render.
347
+
348
+ ### .displayDistance
349
+
350
+ ```js
351
+ displayDistance = 1 : Number
352
+ ```
353
+
354
+ The distance of the viewer to the display.
355
+
356
+ ### .displayAspect
357
+
358
+ ```js
359
+ displayAspect = 0.75 : Number
360
+ ```
361
+
362
+ The aspect ratio of the display.
363
+
364
+ ### .setFromDisplayView
365
+
366
+ ```js
367
+ setFromDisplayView(
368
+ displayDistance : Number,
369
+ displayWidth : Number,
370
+ displayHeight : Number,
371
+ ) : void
372
+ ```
373
+
374
+ Updates the `displayDistance`, `displayAspect`, and the `viewFoV` from viewer and display information.
375
+
376
+ ## PathTracingSceneGenerator
377
+
378
+ Utility class for generating the set of data required for initializing the path tracing material with a bvh, geometry, materials, and textures.
379
+
380
+ ### .generate
381
+
382
+ ```js
383
+ generate( scene : Object3D | Array<Object3D>, options = {} : Object ) : {
384
+ bvh : MeshBVH,
385
+ materials : Array<Material>,
386
+ textures : Array<Texture>,
387
+ lights : Array<Light>
388
+ }
389
+ ```
390
+
391
+ Merges the geometry in the given scene with an additional "materialIndex" attribute that references the associated material array. Also produces a set of textures referenced by the scene materials.
392
+
393
+ ## PathTracingSceneWorker
394
+
395
+ _extends PathTracingSceneGenerator_
396
+
397
+ See note in [Asyncronous Generation](#asynchronous-generation) use snippet.
398
+
399
+ ### .generate
400
+
401
+ ```js
402
+ async generate( scene : Object3D | Array<Object3D>, options = {} : Object ) : {
403
+ bvh : MeshBVH,
404
+ materials : Array<Material>,
405
+ textures : Array<Texture>,
406
+ lights : Array<Light>
407
+ }
408
+ ```
409
+
410
+ ### .dispose
411
+
412
+ ```js
413
+ dispose() : void
414
+ ```
415
+
416
+ ## PhysicalCamera
417
+
418
+ _extends THREE.PerspectiveCamera_
419
+
420
+ An extension of the three.js PerspectiveCamera with some other parameters associated with depth of field. These parameters otherwise do not affect the camera behavior are are for convenience of use with the PhysicalCameraUniform and pathtracer.
421
+
422
+ ### .focusDistance
423
+
424
+ ```js
425
+ focusDistance = 25 : Number
426
+ ```
427
+
428
+ The distance from the camera in meters that everything is is perfect focus.
429
+
430
+ ### .fStop
431
+
432
+ ```js
433
+ fStop = 1.4 : Number
434
+ ```
435
+
436
+ The fstop value of the camera. If this is changed then the `bokehSize` field is implicitly updated.
437
+
438
+ ### .bokehSize
439
+
440
+ ```js
441
+ bokehSize : Number
442
+ ```
443
+
444
+ The bokeh size as derived from the fStop and focal length in millimeters. If this is set then the fStop is implicitly updated.
445
+
446
+ ### .apertureBlades
447
+
448
+ ```js
449
+ apertureBlades = 0 : Number
450
+ ```
451
+
452
+ The number of sides / blades on the aperture.
453
+
454
+ ### .apertureRotation
455
+
456
+ ```js
457
+ apertureRotation = 0 : Number
458
+ ```
459
+
460
+ The rotation of the aperture shape in radians.
461
+
462
+ ### .anamorphicRatio
463
+
464
+ ```js
465
+ anamorphicRatio = 1 : Number
466
+ ```
467
+
468
+ The anamorphic ratio of the lens. A higher value will stretch the bokeh effect horizontally.
469
+
470
+ ## EquirectCamera
471
+
472
+ _extends THREE.Camera_
473
+
474
+ A class indicating that the path tracer should render an equirectangular view. Does not work with three.js raster rendering.
475
+
476
+ ## PhysicalSpotLight
477
+
478
+ _extends THREE.SpotLight_
479
+
480
+ ### .radius
481
+
482
+ ```js
483
+ radius = 0 : Number
484
+ ```
485
+
486
+ The radius of the spotlight surface. Increase this value to add softness to shadows.
487
+
488
+ ### .iesTexture
489
+
490
+ ```js
491
+ iesTexture = null : Texture
492
+ ```
493
+
494
+ The loaded IES texture describing directional light intensity. These can be loaded with the `IESLoader`.
495
+
496
+ Premade IES profiles can be downloaded from [ieslibrary.com]. And custom profiles can be generated using [CNDL](https://cndl.io/).
497
+
498
+ ## ShapedAreaLight
499
+
500
+ _extends THREE.RectAreaLight_
501
+
502
+ ### .isCircular
503
+
504
+ ```js
505
+ isCircular = false : Boolean
506
+ ```
507
+
508
+ Whether the area light should be rendered as a circle or a rectangle.
509
+
510
+ ## DynamicPathTracingSceneGenerator
511
+
512
+ A variation of the path tracing scene generator intended for quickly regenerating a scene BVH representation that updates frequently. Ie those with animated objects or animated skinned geometry.
513
+
514
+ In order to quickly update a dynamic scene the same BVH is reused across updates by refitting rather than regenerating. This is significantly faster but also results in a less optimal BVH after significant changes.
515
+
516
+ If geometry or materials are added or removed from the scene then `reset` must be called.
517
+
518
+ ### constructor
519
+
520
+ ```js
521
+ constructor( scene : Object3D | Array<Object3D> )
522
+ ```
523
+
524
+ Takes the scene to convert.
525
+
526
+ ### .generate
527
+
528
+ ```js
529
+ generate() : {
530
+ bvh : MeshBVH,
531
+ materials : Array<Material>,
532
+ textures : Array<Texture>
533
+ }
534
+ ```
535
+
536
+ Generates and refits the bvh to the current scene state. The same bvh, materials, and textures objects are returns after the initial call until `reset` is called.
537
+
538
+ ### .reset
539
+
540
+ ```js
541
+ reset() : void
542
+ ```
543
+
544
+ Resets the generator so a new BVH is generated. This must be called when geometry, objects, or materials are added or removed from the scene.
545
+
546
+ ## IESLoader
547
+
548
+ _extends Loader_
549
+
550
+ Loader for loading and parsing IES profile data. Load and parse functions return a `DataTexture` with the profile contents.
551
+
552
+ ## BlurredEnvMapGenerator
553
+
554
+ Utility for generating a PMREM blurred environment map that can be used with the path tracer.
555
+
556
+ ### constructor
557
+
558
+ ```js
559
+ constructor( renderer : WebGLRenderer )
560
+ ```
561
+
562
+ ### .generate
563
+
564
+ ```js
565
+ generate( texture : Texture, blur : Number ) : DataTexture
566
+ ```
567
+
568
+ Takes a texture to blur and the amount to blur it. Returns a new `DataTexture` that has been PMREM blurred environment map that can have distribution data generated for importance sampling.
569
+
570
+ ### .dispose
571
+
572
+ ```js
573
+ dispose() : void
574
+ ```
575
+
576
+ Disposes of the temporary files and textures for generation.
577
+
578
+ ## GradientEquirectTexture
579
+
580
+ ### .exponent
581
+
582
+ ```js
583
+ exponent = 2 : Number
584
+ ```
585
+
586
+ ### .topColor
587
+
588
+ ```js
589
+ topColor = 0xffffff : Color
590
+ ```
591
+
592
+ ### .bottomColor
593
+
594
+ ```js
595
+ bottomColor = 0x000000 : Color
596
+ ```
597
+
598
+ ### constructor
599
+
600
+ ```js
601
+ constructor( resolution = 512 : Number )
602
+ ```
603
+
604
+ ### .update
605
+
606
+ ```js
607
+ update() : void
608
+ ```
609
+
610
+ ## MaterialBase
611
+
612
+ _extends THREE.ShaderMaterial_
613
+
614
+ Convenience base class that adds additional functions and implicitly adds object definitions for all uniforms of the shader to the object.
615
+
616
+ ### .setDefine
617
+
618
+ ```js
619
+ setDefine( name : string, value = undefined : any ) : void
620
+ ```
621
+
622
+ Sets the define of the given name to the provided value. If the value is set to null or undefined then it is deleted from the defines of the material. If the define changed from the previous value then `Material.needsUpdate` is set to `true`.
623
+
624
+ ## PhysicalPathTracingMaterial
625
+
626
+ _extends MaterialBase_
627
+
628
+ **Uniforms**
629
+
630
+ ```js
631
+ {
632
+ // The number of ray bounces to test. Higher is better quality but slower performance.
633
+ // TransmissiveBounces indicates the number of additional transparent or translucent surfaces
634
+ // the ray can pass through.
635
+ bounces = 3 : Number,
636
+ transmissiveBounces = 10 : Number,
637
+
638
+ // The number of additional transmissive ray bounces to allow on top of existing bounces for object opacity / transmission.
639
+ transmissiveBounces = 5 : Number,
640
+
641
+ // The physical camera parameters to use
642
+ physicalCamera : PhysicalCameraUniform,
643
+
644
+ // Geometry and BVH information
645
+ bvh: MeshBVHUniformStruct,
646
+ attributesArray: AttributesTextureArray,
647
+ materialIndexAttribute: UIntVertexAttributeTexture,
648
+ materials: MaterialsTexture,
649
+ textures: RenderTarget2DArray,
650
+
651
+ // Light information
652
+ lights: LightsInfoUniformStruct,
653
+ iesProfiles: IESProfilesTexture,
654
+
655
+ // Environment Map information
656
+ envMapInfo: EquirectHdrInfoUniform,
657
+ environmentRotation: Matrix4,
658
+ environmentIntensity = 1: Number,
659
+
660
+ // background blur
661
+ backgroundBlur = 0: Number,
662
+
663
+ // Factor for alleviating bright pixels from rays that hit diffuse surfaces then
664
+ // specular surfaces. Setting this higher alleviates fireflies but will remove some
665
+ // specular caustics.
666
+ filterGlossyFactor = 0: Number,
667
+
668
+ // The equirectangular map to render as the background.
669
+ backgroundMap = null: Texture,
670
+
671
+ // The transparency to render the background with. Note that the "alpha" option
672
+ // must be set to true on PathTracingRenderer for this field to work properly.
673
+ backgroundAlpha: 1.0,
674
+ }
675
+ ```
676
+
677
+ **Defines**
678
+
679
+ ```js
680
+ {
681
+
682
+ // Whether to use multiple importance sampling to help the image converge more quickly.
683
+ FEATURE_MIS = 1 : Number,
684
+
685
+ // Whether to use russian roulette path termination. Path termination will kick in after
686
+ // a minimum three bounces have been performed.
687
+ FEATURE_RUSSIAN_ROULETTE = 1 : Number,
688
+
689
+ }
690
+ ```
691
+
692
+ ## FogVolumeMaterial
693
+
694
+ _extends MeshStandardMaterial_
695
+
696
+ A material used for rendering fog-like volumes within the scene. The `color`, `emissive`, and `emissiveIntensity` fields are all used in the render.
697
+
698
+ > *NOTE*
699
+ > Since fog models many particles throughout the scene and cause many extra bounces fog materials can dramatically impact render time.
700
+
701
+ ### .density
702
+
703
+ The particulate density of the volume.
704
+
705
+ ## DenoiseMaterial
706
+
707
+ _extends MaterialBase_
708
+
709
+ Denoise material based on [BrutPitt/glslSmartDeNoise](https://github.com/BrutPitt/glslSmartDeNoise) intended to be the final pass to the screen. Includes tonemapping and color space conversions.
710
+
711
+ **Uniforms**
712
+
713
+ ```js
714
+ {
715
+
716
+ // sigma - sigma Standard Deviation
717
+ // kSigma - sigma coefficient
718
+ // kSigma * sigma = radius of the circular kernel
719
+ sigma = 5.0 : Number,
720
+ kSigma = 1.0 : Number,
721
+
722
+ // edge sharpening threshold
723
+ threshold = 0.03 : Number,
724
+
725
+ }
726
+ ```
727
+
728
+ ## RenderTarget2DArray
729
+
730
+ _extends WebGLArrayRenderTarget_
731
+
732
+ A convenience extension from `WebGLArrayRenderTarget` that affords easily creating a uniform texture array from an array of textures.
733
+
734
+ ### .setTextures
735
+
736
+ ```js
737
+ setTextures(
738
+ renderer : WebGLRenderer,
739
+ width : Number,
740
+ height : Number,
741
+ textures : Array<Texture>
742
+ ) : void
743
+ ```
744
+
745
+ Takes the rendering context to update the target for, the target dimensions of the texture array, and the array of textures to render into the 2D texture array. Every texture is stretched to the dimensions of the texture array at the same index they are provided in.
746
+
747
+ ## PhysicalCameraUniform
748
+
749
+ Uniform for storing the camera parameters for use with the shader.
750
+
751
+ ### .updateFrom
752
+
753
+ ```js
754
+ updateFrom( camera : PerspectiveCamera | PhysicalCamera ) : void
755
+ ```
756
+
757
+ Copies all fields from the passed PhysicalCamera if available otherwise the defaults are used.
758
+
759
+ ## AttributesTextureArray
760
+
761
+ A combined texture array used to store normal, tangent, uv, and color attributes in the same texture sampler array rather than separate samplers. Necessary to save texture slots.
762
+
763
+ Normals, tangents, uvs, and color attribute data are stored in the 1st, 2nd, 3rd, and 4th layers of the array respectively.
764
+
765
+ ### .updateNormalAttribute
766
+
767
+ ```js
768
+ updateNormalAttribute( attr : BufferAttribute ) : void
769
+ ```
770
+
771
+ ### .updateTangentAttribute
772
+
773
+ ```js
774
+ updateTangentAttribute( attr : BufferAttribute ) : void
775
+ ```
776
+
777
+ ### .updateUvAttribute
778
+
779
+ ```js
780
+ updateUvAttribute( attr : BufferAttribute ) : void
781
+ ```
782
+
783
+ ### .updateColorAttribute
784
+
785
+ ```js
786
+ updateColorAttribute( attr : BufferAttribute ) : void
787
+ ```
788
+
789
+ ### .updateFrom
790
+
791
+ ```js
792
+ updateFrom(
793
+ normal : BufferAttribute,
794
+ tangent : BufferAttribute,
795
+ uv : BufferAttribute,
796
+ color : BufferAttribute
797
+ ) : void
798
+ ```
799
+
800
+ ## MaterialsTexture
801
+
802
+ _extends DataTexture_
803
+
804
+ Helper texture uniform for encoding materials as texture data.
805
+
806
+ ### .threeCompatibilityTransforms
807
+
808
+ ```js
809
+ threeCompatibilityTransforms = false : Boolean
810
+ ```
811
+
812
+ Three.js materials support only a single set of UV transforms in a certain fallback priority while the pathtracer supports a unique set of transforms per texture. Set this field to true in order to use the same uv transform handling as three.js materials.
813
+
814
+ See fallback order documentation [here](https://threejs.org/docs/#api/en/textures/Texture.offset).
815
+
816
+ ### .setMatte
817
+
818
+ ```js
819
+ setMatte( index : Number, matte : Boolean ) : void
820
+ ```
821
+
822
+ Sets whether or not the material of the given index is matte or not. When "true" the background is rendered in place of the material.
823
+
824
+ ### .setCastShadow
825
+
826
+ ```js
827
+ setCastShadow( index : Number, enabled : Boolean ) : void
828
+ ```
829
+
830
+ Sets whether or not the material of the given index will cast shadows. When "false" materials will not cast shadows on diffuse surfaces but will still be reflected. This is a good setting for lighting enclosed interiors with environment lighting.
831
+
832
+ ### .updateFrom
833
+
834
+ ```js
835
+ updateFrom( materials : Array<Material>, textures : Array<Texture> ) : void
836
+ ```
837
+
838
+ Updates the size and values of the texture to align with the provided set of materials and textures.
839
+
840
+ The "matte" and "side" values must be updated explicitly.
841
+
842
+ > **Note**
843
+ > In order for volume transmission to work the "attenuationDistance" must be set to a value less than Infinity or "thickness" must be set to a value greater than 0.
844
+
845
+ ## LightsInfoUniformStruct
846
+
847
+ Helper uniform for encoding lights as texture data with count.
848
+
849
+ ### .updateFrom
850
+
851
+ ```js
852
+ updateFrom( lights : Array<Light>, iesTextures = [] : Array<Texture> ) : void
853
+ ```
854
+
855
+ Updates the size and values of the texture to align with the provided set of lights and IES textures.
856
+
857
+ ## EquirectHdrInfoUniform
858
+
859
+ Stores the environment map contents along with the intensity distribution information to support multiple importance sampling.
860
+
861
+ ### .updateFrom
862
+
863
+ ```js
864
+ updateFrom( environmentMap : Texture ) : void
865
+ ```
866
+
867
+ Takes an environment map to process into something usable by the path tracer. Is expected to be a DataTexture so the data can be read.
868
+
869
+ ## Functions
870
+
871
+ ### mergeMeshes
872
+
873
+ ```js
874
+ mergeMeshes( meshes : Array<Mesh> ) : {
875
+ materials : Array<Material>,
876
+ textures : Array<Textures>,
877
+ geometry : BufferGeometry
878
+ }
879
+ ```
880
+
881
+ Merges the set of meshes into a single geometry with a `materialIndex` vertex attribute included on the geometry identifying the associated material in the returned `materials` array.
882
+
883
+ ## CompatibilityDetector
884
+
885
+ Detects whether the path tracer can run on the current device by checking whether struct precision is reliable and the material shader will compile.
886
+
887
+ ### constructor
888
+
889
+ ```js
890
+ constructor( renderer : WebGLRenderer, material : Material )
891
+ ```
892
+
893
+ Takes a WebGLRenderer to use and material to test again.
894
+
895
+ ### .detect
896
+
897
+ ```js
898
+ detect() : {
899
+ pass: Boolean,
900
+ message: String
901
+ }
902
+ ```
903
+
904
+ Returns `pass === true` if the path tracer can run. If it cannot run then a message is returned indicating why.
905
+
906
+ ## Shader Chunks
907
+
908
+ **shaderMaterialSampling**
909
+
910
+ Set of functions for performing material scatter and PDF sampling. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderMaterialSampling.js) for full list of functions.
911
+
912
+ **shaderLightSampling**
913
+
914
+ Set of functions for performing light sampling. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderLightSampling.js) for full list of functions.
915
+
916
+ **shaderStructs**
917
+
918
+ Material and light struct definition for use with uniforms. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderStructs.js) for full list of functions.
919
+
920
+ **shaderUtils**
921
+
922
+ Set of randomness and other light transport utilities for use in a shader. See the [implementation](https://github.com/gkjohnson/three-gpu-pathtracer/blob/main/src/shader/shaderUtils.js) for full list of functions.
923
+
924
+ # Gotchas
925
+
926
+ - The project requires use of WebGL2.
927
+ - All textures must use the same wrap and interpolation flags.
928
+ - SpotLights, DirectionalLights, and PointLights are only supported with MIS.
929
+ - Only MeshStandardMaterial and MeshPhysicalMaterial are supported.
930
+ - Instanced geometry and interleaved buffers are not supported.
931
+ - Emissive materials are supported but do not take advantage of MIS.
932
+
933
+ # Screenshots
934
+
935
+ ![](https://user-images.githubusercontent.com/734200/162584469-68e6df38-92da-4a13-b352-ca0bdea14548.png)
936
+
937
+ <p align="center">
938
+ <i>Sample materials</i>
939
+ </p>
940
+
941
+ ![](https://user-images.githubusercontent.com/734200/163835927-be75d2c0-f27b-4e4b-a3eb-2371043fa5e1.png)
942
+
943
+ ![](https://user-images.githubusercontent.com/734200/163839431-ed75e64d-9ae4-4423-afca-55162a44873e.png)
944
+
945
+ <p align="center">
946
+ <i>"SD Macross City Standoff Diorama" scene by <a href="https://sketchfab.com/3d-models/sd-macross-city-standoff-diorama-b154220f7e7441799d6be2f7ff9658c7">tipatat</a></i>
947
+ </p>
948
+
949
+ ![](./docs/interior-scene-cropped.png)
950
+
951
+ <p align="center">
952
+ <i>"Interior Scene" model by <a href="https://sketchfab.com/3d-models/interior-scene-45ddbbc4c2dc4f8ca9ed99da9a78326a">Allay Design</a></i>
953
+ </p>
954
+
955
+ ![](https://user-images.githubusercontent.com/734200/161820794-df0da371-ee5c-4368-9e7b-5e7daf6cf3c7.png)
956
+
957
+ ![](https://user-images.githubusercontent.com/734200/162550315-3cdabf40-3dea-4d7d-bcfc-eb543eea2d93.png)
958
+
959
+ <p align="center">
960
+ <i>Perseverance Rover, Ingenuity Helicopter models by <a href="https://mars.nasa.gov/resources/25042/mars-perseverance-rover-3d-model/">NASA / JPL-Caltech</a></i>
961
+ </p>
962
+
963
+ ![](https://user-images.githubusercontent.com/734200/161877900-566652e4-c799-4940-bccb-0c8f4cea5387.png)
964
+
965
+ <p align="center">
966
+ <i>Gelatinous Cube model by <a href="https://sketchfab.com/3d-models/gelatinous-cube-e08385238f4d4b59b012233a9fbdca21">glenatron</a></i>
967
+ </p>
968
+
969
+ ![](https://user-images.githubusercontent.com/734200/161822206-c27bf594-d648-4735-868e-4baf4e414802.png)
970
+
971
+ ![](https://user-images.githubusercontent.com/734200/161822214-eace4297-03c4-4adc-b472-efe29a862685.png)
972
+
973
+ <p align="center">
974
+ <i>Lego models courtesy of the <a href="https://omr.ldraw.org/">LDraw Official Model Repository</a></i>
975
+ </p>
976
+
977
+ ![](https://user-images.githubusercontent.com/734200/161877196-7ae2769e-7e54-4694-9ca8-e8f5219d1c2d.png)
978
+
979
+ <p align="center">
980
+ <i>Octopus Tea model by <a href="https://sketchfab.com/3d-models/cartoon-octopus-takes-a-tea-bath-107260cf0fd24202a67eb037a6c760a5
981
+ ">AzTiZ</a></i>
982
+ </p>
983
+
984
+ ![](https://user-images.githubusercontent.com/734200/173212652-de6a83e5-dd2c-49b5-8ed7-484ff8969b5b.png)
985
+ <p align="center">
986
+ <i>Botanists Study model by <a href="https://sketchfab.com/3d-models/the-botanists-study-8b7b5743b1c848ed8ea58f5518c44e7e">riikkakilpelainen</a></i>
987
+ </p>
988
+
989
+ ![](https://user-images.githubusercontent.com/734200/173170459-849b9343-efe3-4635-8719-346511472965.png)
990
+ <p align="center">
991
+ <i>Japanese Bridge Garden model by <a href="https://sketchfab.com/3d-models/japanese-bridge-garden-d122e17593eb4012913cde927486d15a">kristenlee</a></i>
992
+ </p>
993
+
994
+ ### Resources
995
+
996
+ [Raytracing in One Weekend Book](https://raytracing.github.io/)
997
+
998
+ [PBR Book](https://pbr-book.org/)
999
+
1000
+ [knightcrawler25/GLSL-PathTracer](https://github.com/knightcrawler25/GLSL-PathTracer/)
1001
+
1002
+ [DassaultSystemes-Technology/dspbr-pt](https://github.com/DassaultSystemes-Technology/dspbr-pt)
1003
+
1004
+