How to add easing to p5.js sketch

Question

Complete beginner here so apologies for what is probably an obvious solution —

I'm using the atan2 function in p5.js to create a simple sketch where an arrow (imported svg) is following the cursor. How would one add easing to the movement?

Code is below

var img1;
var x = 0;
var y = 0;

function preload (){
    img1 = loadImage("arrow_02.svg");
}

function setup() {
    createCanvas(windowWidth, windowHeight);
}

function draw() {
    background(0);
     
    let posX = width/2;
    let posY = height/2;
      
    let angle = atan2(mouseY-posY, mouseX-posX);
  
    translate(posX, posY);
    rotate(angle);
    imageMode(CENTER);
    image(img1, x, y, 500,500);

}

Here's a link to my sketch — https://editor.p5js.org/StudioBo/sketches/QGGXcXBmB

Many thanks in advance. V.

question from:https://stackoverflow.com/questions/65865576/how-to-add-easing-to-p5-js-sketch

Answer 1

Waitting for answers