Fire Material

Fire material

Using the fire material

Fire material can be found here: https://cdn.babylonjs.com/materialsLibrary/babylon.fireMaterial.js

A demo can be found here: PG: Fire Material

The fire material works with 3 textures:

  • The diffuse texture (fire texture)
  • The distortion texture (to create perturbations on diffuse texture)
  • The opacity texture (black and white)

Note: The fire material doesn't work with lighting. So, shadow maps are also disabled.

var fireMaterial = new BABYLON.FireMaterial("fireMaterial", scene);
fireMaterial.diffuseTexture = new BABYLON.Texture("diffuse.png", scene);
fireMaterial.distortionTexture = new BABYLON.Texture("distortion.png", scene);
fireMaterial.opacityTexture = new BABYLON.Texture("opacity.png", scene);
var plane = BABYLON.Mesh.CreatePlane("fireplane", 1.0, scene);
plane.material = fireMaterial;

The speed of fire flames can be customized like:

fireMaterial.speed = 5.0; // Default is 1.0