pixijs / particle-emitter

A particle system for PixiJS
http://pixijs.io/particle-emitter/docs
MIT License
799 stars 127 forks source link

AnimatedParticle.prototype.update wrong frame calculation #103

Closed SergiyTopalov closed 5 years ago

SergiyTopalov commented 5 years ago
AnimatedParticle.prototype.update = function (delta) {
    var lerp = this.Particle_update(delta);
    //only animate the particle if it is still alive
    if (lerp >= 0) {
        this.elapsed += delta;
        if (this.elapsed > this.duration) {
            //loop elapsed back around
            if (this.loop)
                this.elapsed = this.elapsed % this.duration;
            else
                this.elapsed = this.duration - 0.000001;
        }
        var frame = (this.elapsed * this.framerate + 0.0000001) | 0;
        this.texture = this.textures[frame] || PIXI.Texture.EMPTY;
    }
    return lerp;
};

I used this library on my project and i`ve got the situation when frame was bigger than textures length. I think the problem in this row: var frame = (this.elapsed * this.framerate + 0.0000001) | 0; Why do we add 0.0000001

andrewstart commented 5 years ago

The short answer is to stop floating point errors from preventing the final texture from displaying.

I've had issues in the past where Math.floor(this.elapsed * this.framerate) when elapsed was at the end resulted in textures.length - 2, not the desired textures.length - 1. By adding a number larger than any possible floating point error but small enough to not affect the calculation proper, then flooring it, ends up with a fix for the floating point error throwing off the frame calculation.

If you think this is causing I problem, then I will need more information on the configuration you are initializing the AnimatedParticle with (loop, # of textures, framerate).