A prototypical WebGL-based Multi-frame Sampling viewer for 3D scenes using Three.js. Based on the paper "Progressive Rendering using Multi-Frame Sampling" by Daniel Limberger, Karsten Tausche, Johannes Linke, and Jürgen Döllner (published in GPU Pro 7, edited by Wolfgang Engel, pp.125-141, 2016).
Click here for examples.
- Kernel-based Multi-frame Sampling
- Anti-Aliasing
- Soft Shadows
- Depth-of-Field
- SSAO
- Trackball controls
- Presets for light and camera position
- Automatic detection of highest texture precision for render targets (float > half-float > byte)
- DPI-sensitive rendering (no blurry images on high DPI displays)
- Untextured .obj models
- JSON Model Format
Get and include the following .js files in your HTML code:
- mfsv.js
- kernels.js
- three.js
- TrackballControls.js
- dat.gui.js
- OBJLoader.js
- stats.js (optional)
- eval.js (optional)
<div class="mfsviewer" objPath="obj/mitsuba.obj">
<div class="mfsviewer" jsonPath="obj/crytek-sponza.json">
All textures need to be located in a subdirectory called "textures" relative to the model file. A Python script to convert textured .obj models into JSON models can be found here.
msoechting.github.io/mfsv/demo-teapot.html?shadowMapSize=512&forcefloat=1
- shadowMapSize: Sets the width and height for the shadow map.
- forcefloat: If set to 1, forces the renderer to use float texture precision, regardless of detected WebGL extensions.