We gaan nu een bal laten stuiteren, maar die beweegt niet rechtlijnig (constant). Hij beweegt volgens een sinus-functie. Als je niet weet wat dat is, kijk deze video.
Zoals je weet gaat de sinus tussen -1 en +1. Dus als je die in een sketch wilt gebruiken is de map-functie erg handig. Je krijgt dan deze animatie:
// original by
// Courtney Morgan
// https://editor.p5js.org/cmorgantywls/sketches
// edited for speed is now reserved word
let angle = 0.0;
let offset = 60;
let scalar = 30;
let mySpeed = 0.05; // speed is reserverd word after version so much
function setup() {
createCanvas(120, 120);
background(204);
}
function draw() {
let x = offset + cos(angle) * scalar;
let y = offset + sin(angle) * scalar;
ellipse(x, y, 40, 40);
angle += mySpeed;
}
Cosinus en Sinus maken een cirkel
Deze eenvoudige code laat de cirkel in een cirkel rond draaien
// original by
// Courtney Morgan
// https://editor.p5js.org/cmorgantywls/sketches
let angle = 0.0;
let offset = 60;
let scalar = 30;
let speed = 0.05;
function setup() {
createCanvas(120, 120);
background(204);
}
function draw() {
let x = offset + cos(angle) * scalar;
let y = offset + sin(angle) * scalar;
ellipse(x, y, 40, 40);
angle += speed;
}
Opdracht Sinus en Cosinus
Als je handig speelt met de 4 variabelen, kun je een supercoole sketch maken. Probeer het uit en lever je coolste oplossing code + screenshot in.
Hieronder mijn versie, die is mooi. Maak zelf een andere mooie.
