three-particle-fire

Fire mesh object for three.js

!MIT License


Demos can be seen here.

Usage

1. Import your three.js and then prepare three-particle-fire to use.
``javascript
import * as THREE from 'three';
import particleFire from 'three-particle-fire';

particleFire.install( { THREE: THREE } );
`

2. Now ready to use. particleFire will provide geometry and material for THREE.Points class.
`javascript
var fireRadius = 0.5;
var fireHeight = 3;
var particleCount = 800;
var height = window.innerHeight;

var geometry0 = new particleFire.Geometry( fireRadius, fireHeight, particleCount );
var material0 = new particleFire.Material( { color: 0xff2200 } );
material0.setPerspective( camera.fov, height );
var particleFireMesh0 = new THREE.Points( geometry0, material0 );
scene.add( particleFireMesh0 );
`

3. Update on tick in your render loop.
`javascript
function update () {

var delta = clock.getDelta();

requestAnimationFrame( update );

particleFireMesh0.material.update( delta );
renderer.render( scene, camera );

}
`

4. Sync on onresize event

`javascript
window.addEventListener( 'resize', function () {

var width = window.innerWidth;
var height = window.innerHeight;

camera.aspect = width / height;
camera.updateProjectionMatrix();
renderer.setSize( width, height );

particleFireMesh0.material.setPerspective( camera.fov, height );

} );
``