npm

npm’s 2019 JavaScript ecosystem survey analysis is now available! Get your copy here »

three-effectcomposer-es6

0.0.4 • Public • Published

three-effectcomposer-es6

ES6-friendly version of THREE.EffectComposer, which offers a quick GLSL post-processing implementation.

Full credit goes to @alteredq for writing this, and to @hughsk for the Browserify-friendly version. The original source can be found here.

Installation

npm install three-effectcomposer-es6

Usage

import { WebGLRenderer, Scene, PerspectiveCamera } from 'three'
import EffectComposer, { RenderPass, ShaderPass, CopyShader } from 'three-effectcomposer-es6'
 
class Main {
  constructor () {
    const renderer = new WebGLRenderer()
    const scene = new Scene()
    const camera = new PerspectiveCamera(70, window.innerWidth / window.innerHeight, 1, 1000)
 
    // When you've made your scene, create your composer and first RenderPass
    this.composer = new EffectComposer(renderer)
    this.composer.addPass(new RenderPass(scene, camera))
 
    // Add shaders! Celebrate!
    // const someShaderPass = new ShaderPass(SomeShader)
    // this.composer.addPass(someShaderPass)
 
    // And draw to the screen
    const copyPass = new ShaderPass(CopyShader)
    copyPass.renderToScreen = true
    this.composer.addPass(copyPass)
  }
 
  animate () {
    // Instead of calling renderer.render, use
    // composer.render instead:
    this.composer.render()
    window.requestAnimationFrame(this.animate)
  }
}
 
const main = new Main()
main.animate()

install

npm i three-effectcomposer-es6

Downloadsweekly downloads

104

version

0.0.4

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability