mfsv

A prototypical WebGL-based Multi-frame Sampling viewer for 3D scenes using Three.js. Examples hosted here.

Features

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-senstive rendering (no blurry images on high DPI displays)

Supported model formats

Untextured .obj models
JSON Model Format

Usage

Step 1: Include .js files

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
eval.js

Step 2: Displaying a model

OBJ model

<div class="mfsviewer" objPath="obj/mitsuba.obj">

JSON model format

<div class="mfsviewer" jsonPath="obj/crytek-sponza.json">

All textures need to be located in a subdirectory called "textures". A Python script to convert textured .obj models into JSON models can be found here.

Optional URL Parameters

emberflare.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.

hpicgs / mfsv