Creé un ejemplo con un filtro (una imagen se superpone a otra)

Trabajo implementado aquí: https://cranky-bassi-59e8b2.netlify.app/

Para seguir el cursor detrás del mouse, usé el siguiente código

 const circle = new PIXI.Graphics() .beginFill(0xFFFFFF) .drawCircle(radius + blurSize, radius + blurSize, radius) .endFill(); circle.filters = [new PIXI.filters.BlurFilter(blurSize)]; const bounds = new PIXI.Rectangle(0, 0, (radius + blurSize) * 2, (radius + blurSize) * 2); const texture = app.renderer.generateTexture(circle, PIXI.SCALE_MODES.NEAREST, 1, bounds); focus = new PIXI.Sprite(texture); focus.scale.set(1.5, 1.5); function getMousePosition() { return app.renderer.plugins.interaction.mouse.global; } let xVelocity = 0.1; let yVelocity = 0.1; let mousePosition = getMousePosition(); let speed = 11; let angle = 45; let moveTicker = PIXI.Ticker.shared; moveTicker.autoStart = false; moveTicker.add(() => { mousePosition = getMousePosition(); let dx = (mousePosition.x - focus.x) - (focus.width / 2); let dy = (mousePosition.y - focus.y) - (focus.height / 2); angle = Math.atan2(dy, dx); xVelocity = Math.cos(angle) * speed; yVelocity = Math.sin(angle) * speed; focus.x += xVelocity; focus.y += yVelocity; })

Sin embargo, esta función no funciona correctamente cuando el cursor está inmóvil (el foco se contrae a la velocidad lenta del mouse). Lo que estoy hablando se puede ver en el sitio desplegado

¿Cómo puedo eliminar este comportamiento?

Actualización (resuelto):

Solo necesita reemplazar el código de teletipo para

 focus.x += .1 * (mousePosition.x - focus.x - (focus.width / 2)); focus.x = Math.round(100 * focus.x) / 100; focus.y += .1 * (mousePosition.y - focus.y - (focus.height / 2)); focus.y = Math.round(100 * focus.y) / 100;