Onde radiali oscillanti

Facendo oscillare il raggio si possono ottenere ondulazioni visualizzate radialmente, attorno a un centro, come se la lunghezza del raggio fosse la coordinata y di un punto che si sposta su un asse delle ‘x’ circolare. Se anche l’ampiezza delle onde oscilla nel tempo, le onde si alzano e si abbassano senza spostarsi lungo il cerchio, come quelle di una corda che vibra.

    function setup() {
    createCanvas( 670, 240 );
}

function draw() {
    background( 255 );

    let ampiezza = sin( frameCount*0.05 );
    let passoRadianti = TWO_PI/300;
    for (let radianti=0; radianti < TWO_PI; radianti+=passoRadianti) {

        let oscillazione = sin( radianti*10 ) * ampiezza;
        let raggio = map( oscillazione, -1, 1, 40, 80 );

        let x = 335 + cos(radianti)*raggio;
        let y = 120 + sin(radianti)*raggio;
        circle( x,y, 2 );
    }
}

Algoritmo

a ogni fotogramma:                                                draw()
    calcolare l'ampiezza delle onde, che oscilla nel tempo        sin()
    per ogni angolo, da 0 a un giro completo:                     for()
        calcolare un'oscillazione, moltiplicata per l'ampiezza    sin()
        trasformarla in un raggio, fra 40 e 80 pixel              map()
        trovare il punto con quell'angolo e quel raggio           cos()
        disegnare un piccolo cerchio

Istruzioni

Con lo stesso angolo, cos() e sin() restituiscono le coordinate di un punto su un cerchio di raggio 1: moltiplicate per raggio e sommate al centro della tela, 335, 120, danno un punto del cerchio di quel raggio. Mentre l’angolo cresce da 0 a TWO_PI, il punto fa un giro completo.

Va da -1 a 1 e torna indietro in circa due secondi, ed è la stessa per tutti i punti del giro.

Lungo il giro l’oscillazione fa 10 onde complete. Moltiplicate per l’ampiezza, le onde si appiattiscono quando l’ampiezza vale 0 e si capovolgono quando diventa negativa: le creste diventano avvallamenti, e gli avvallamenti creste, mentre le onde restano ferme.

Trasforma l’oscillazione in un raggio, fra 40 e 80 pixel: i punti si allontanano e si avvicinano al centro seguendo le onde, e quando l’ampiezza vale 0 formano un cerchio di raggio 60.

Variazioni

Con un valore più grande l’ampiezza cambia più in fretta, e le onde vibrano più velocemente:

Il moltiplicatore decide quante onde compaiono lungo il giro. Con un valore non intero, come 5.5, l’ultima onda non si chiude e resta un salto:

Con un intervallo più ampio le onde diventano più profonde:

Approfondimenti: