Animate the intensity on an emissive material

Hiya, is it possible to animate the intensity on the emissive part of a material in play canvas?


Hi @davidj2022,

Yes, one way to do it is using the tween library. Check at the bottom of this page on how you can animate the colour of a material.

In a similar way you can animate any numeric material property.

1 Like

thanks for this… I’m having some trouble getting it to work with the emissive intensity however.

This is the project:

this is the error message I get:

this.fromemissiveintensity.clone is not a function

many thanks

So this code won’t work:

    this.tween =
        .to(this.toemissiveintensity, this.duration, pc[this.easing])

If you check the link I posted, the way to tween a material property is different:


To that regard, tweening emission intensity will be something like this:

const material = this.entity.render.material;

const data = {
    intensity: material.emissiveIntensity
    .to({intensity: 1.0}, 1.0, pc.Linear)
    .on('update', function () {
        material.emissiveIntensity = data.intensity;

For other who arrive here and try to cut/paste this code…it should be…


…and not…



1 Like

Thanks @Grimmy, I’ve updated the code.