a simple ThreeJS vignette background
npm install three-vignette-background
A soft vignette background for ThreeJS demos with a simplex noise grain. This returns a THREE.Mesh with a plane geometry and a shader which does not project into camera space, and so it fits across the entire device viewport.
Currently, browserify is required to use this module as it has a hard dependency on glslify, a browserify transform.
Also see gl-vignette-background.
``sh`
npm install three-vignette-background --save
`js
var createOrbitViewer = require('three-orbit-viewer')(THREE)
var createBackground = require('./')
var app = createOrbitViewer({
clearColor: 'rgb(40, 40, 40)',
clearAlpha: 1.0,
fov: 55,
position: new THREE.Vector3(0, 2, -2)
})
// add a default background
var background = createBackground()
app.scene.add(background)
// ... setup rest of scene ...
`
See demo.js for another usage example.

#### background = createBackground([opt])
Creates a new vignette background with some default options. Turning the grainScale or noiseAlpha to zero will not compute the grain noise.
- geometry the geometry to use, defaults to new PlaneGeometry(2, 2, 1)colors
- an array of two colors to use; either strings or THREE.Color objects; default [ '#fff', '#283844' ]aspect
- aspect ratio for grain and vignette; default 1grainScale
- how large to scale the grain particles, default 0.005grainTime
- the time offset for animating grain; default 0noiseAlpha
- the alpha to blend the noise onto the background, default 0.25smooth
- an [x, y] array or THREE.Vector2 with the low and high smoothstep values for the vignetting, default [ 0, 1 ]scale
- a number, [x, y] array, or THREE.Vector2 with the scaling for the vignette, default 1offset
- a [x, y] array or THREE.Vector2 to offset the vignette; default [0, 0]aspectCorrection
- a boolean, default false, as to whether to correct the vignette scale to the aspect value
#### background.style(opt)
Re-style the background. Any values that are specified in opt will be set, others will not be changed. Takes all the same values except geometry`, which must be set at creation time.
MIT, see LICENSE.md for details.