A WebGL2 path-tracer implementing the
Enterprise PBR Shading Model (DSPBR).
$3
[x] Browser-based, unbiased GPU path-tracing
* [x] Three.js compatibility
* The renderer loads the three.js scene group format
* The interface is similar to WebGLRenderer
* [x] When fed with
glTF via three.js GLTFLoader it supports most of the new
glTF PBR Next material extensions and wip extension proposals (marked as PR below).
All of the mentioned extensions are implemented in terms of the Enterprise PBR specification. If you're interested in equations head over to the spec repo and check our
latest specification document. If you're looking for code,
dspbr.glsl should give you most of the relevant pieces.
*
KHR_materials_sheen
*
KHR_materials_clearcoat
*
KHR_materials_transmission
*
KHR_materials_specular
*
KHR_materials_ior
*
KHR_materials_volume
*
KHR_materials_translucency PR
* [x]
Validated against the official Dassault Systèmes Stellar renderer for the available set of validation scenes. Currently, this only covers a subset of the material features.
> ### Caveats
> The renderer serves as a fancy wrapper for the Enterprise PBR Shading Model code sample,
performance is not a priority. Some major limiting factors are
> * Naive single-level BVH acceleration structure which is slow and prohibits dynamic scenes.
> * Plain WebGL2 for accessibility reasons. Implied API limits and required overhead in shader complexity to make "arbitrary" scenes with texturable PBR materials work for path-tracing is insane and a major performance drag.
> * No light importance sampling. Expect a significant amount of slow-converging noise for high frequency lighting scenarios and rough materials.
Installation
``
bash
npm install dspbr-pt
`
Example
`
javascript
import { PathtracingRenderer, PerspectiveCamera, Loader} from 'dspbr-pt';
let renderer = new PathtracingRenderer(canvas);
let camera = new PerspectiveCamera(45, canvas.width/canvas.height, 0.01, 1000);
const normalizeSceneDimension = true;
const scenePromise = Loader.loadScene(scene_url, normalizeSceneDimension);
const iblPromise = Loader.loadIBL(ibl_url);
Promise.all([scenePromise, iblPromise]).then(([gltf, ibl]) => {
renderer.setIBL(ibl);
renderer.setScene(gltf.scene, gltf).then(() => {
renderer.render(camera, -1, (frame) => {
controls.update();
console.log("Finished frame number:", frame);
})
});
});
``
For more details, please check the
demo viewer and the
renderer interface implementations.
License
* Source code license info in
LICENSE