Trasformazioni in fase di visualizzazione

// height=300 lines=auto
let font;
let punti;

function preload() {
    font = loadFont("assets/UbuntuCondensed.ttf");
}
function setup() {
    createCanvas(670,300);
    punti = font.textToPoints("testo", 30, 260, 320);
}
function draw() {
    let vettori = [];
    for (let i = 0; i < punti.length; ++i) {
        let vettore = createVector(punti[i].x,punti[i].y);
        vettori[i] = vettore;
    }
    background(255);
    for (let vett of vettori) {
        let vett2 = vett.copy();
        vett2.add(15, random(-10)); // COPIA SPOSTATA DEL VETTORE
        line(vett.x, vett.y, vett2.x, vett2.y);
    }
}

let vett2 = vett.copy();
vett2.add(15, random(-10)); // COPIA SPOSTATA DEL VETTORE
line(vett.x, vett.y, vett2.x, vett2.y);

Duplica il vettore e aggiunge 15 pixel alla coordinata x e un valore casuale fra 0 e -15 alla coordinata y. Usa il nuovo vettore per disegnare la secondo estremità di un segmento.

stroke( vett.heading()*150, vett.mag()*0.4, 0 );
line(vett.x, vett.y, vett2.x, vett2.y);

Strutturazione dei file: