Usare le posizioni precedenti del mouse

Muovere il cursore del mouse sopra il canvas.

    let posX = [];
let posY = [];
let posMax = 25;  // numero massimo di  posizioni

function draw() {
    background( 220 );

    // aggiorna gli array
    posX.unshift( mouseX );
    posY.unshift( mouseY );
    if (posX.length > posMax) {
        posX.pop();
        posY.pop();
    }

    // disegna i cerchi
    for (let i = posX.length-1;  i >= 0;  --i) {
        let diametro = posMax-i;
        circle( posX[i],posY[i], diametro );
    }
}
  

  posX/*1*/.unshift( mouseX )/**/;
posY/*1*/.unshift( mouseY )/**/;

Aggiungi le attuali coordinate del cursore del mouse in cima agli array.

  if (posX.length > posMax) {
    posX/*1*/.pop()/**/;
    posY/*1*/.pop()/**/;
}

Elimina l’ultimo elemento di ogni array, solo se il loro numero supera il valore di posMax.

  for (let i = posX.length-1;  i >= 0;  --i) {

Esegue un for() dall’ultimo elemento (posX.length-1) al primo (0). Così il cerchio superiore sarà quello che avrà le coordinate correnti.

  let diametro = /*1*/posMax-i/**/;

Permette di ottenere un diametro crescente in un for() con variabile di iterazione (i) decrescente.