Saturday 23 March 2019

p5 TAIL

After my last post, I got to work on another Wireframe conversion from Python to JS using p5, this one is from issue 6:
This is the code, simple eh? I did need a wee bit of help from Paweł Dawczak as I'm not totally au fait with the vagaries of Python.
const segment_size = 50;
const angle = 2.5;
const phase_step = 0.3;
const wobble_amount = 0.8;
const speed = 4.0;
const width = 600;
const height = 600;
let seconds = 0;
let tail_pieces = [];
function setup() {
    createCanvas(width, height);
    tail_pieces = Array.from({
        length: 10
    }, (_, i) => ({
        img: loadImage('images/tail_piece.png'),
        x: null,
        y: null
    }));
    tail_pieces.push({
        img: loadImage('images/tail_hook.png'),
        x: null,
        y: null
    });
}
function draw() {
    clear();
    seconds += 0.01;
    let x = width - (segment_size * 2);
    let y = height - (segment_size * 2);
    tail_pieces.forEach(function(p, index, arr) {
        p.x = x;
        p.y = y;
        const temp_angle = angle + wobble_amount * Math.sin(index * phase_step + seconds * speed);
        x += segment_size * Math.cos(temp_angle)
        y -= segment_size * Math.sin(temp_angle)
    });
    tail_pieces.filter((p,index) => index % 2 === 0 && image(p.img, p.x, p.y));
    tail_pieces.filter((p,index) => index % 2 === 1 && image(p.img, p.x, p.y));
}

No comments:

Post a Comment