Les 6 - Array bewerken, UI en random


Hieronder de presentatie uit de les van 9 oktober 2025

Javascript_les5.pdf

Hieronder de code van de les:

//maak lijsten met elementen
let x = [50, 250, 450];
let y = [100,300,500];
let w = [40,60,80];
let wKeuze = [20,40,60,80];

function setup() {

  createCanvas(windowWidth,windowHeight);
  background(255);
}

function draw() {
  //teken voor elk element uit de lijst een ellipse
  for (let i = 0; i < x.length; i++) {
    ellipse(x[i],y[i],w[i],w[i]);
  }
}

function mousePressed() {
  //sla willekeurige waarde uit wKeuze-lijst
  //op in variabele wAdd;
  let wAdd = random(wKeuze);

  //voeg deze waarde aan de w-lijst toe
  w.push(wAdd);

  //deel deze waarde door 2
  wAdd = wAdd/2;

  //voeg willekeurig getal toe aan x & y
  //zorg dat deze niet onder de helft van de breedte
  //en hoogte van de bal uitkomt. 
  x.push(floor(random(wAdd,windowWidth-wAdd)));
  y.push(floor(random(wAdd,windowHeight-wAdd)));
}