Liukupalkit ja kaksi for-silmukkaa

var aSlider;                            // Luodaan muuttuja sSlider
var bSlider;                            // Luodaan muuttuja bSlider
var cSlider;                            // Luodaan muuttuja cSlider
var dSlider;                            // Luodaan muuttuja dSlider
function setup() {
  createCanvas(600, 600);               // Ikkunan koko 600 x 600
  noFill();                             // Ei täyttöä
  aSlider = createSlider(1, 600, 100);  // Luodaan liukupalkki aSlider, joka saa arvoja väliltä 1...600
  aSlider.position(10, 20);             // Liukupalkin aSlider paikka on 10 px oikealle ja 20 px alas
  bSlider = createSlider(30, 200, 90);  // Luodaan liukupalkki bSlider, joka saa arvoja väliltä 30...200
  bSlider.position(160, 20);            // Liukupalkin bSlider paikka on 160 px oikealle ja 20 px alas
  cSlider = createSlider(0, 255, 128);  // Luodaan liukupalkki cSlider, joka saa arvoja väliltä 0...255
  cSlider.position(310, 20);            // Liukupalkin cSlider paikka on 310 px oikealle ja 20 px alas
  dSlider = createSlider(-360, 360, 0); // Luodaan liukupalkki dSlider, joka saa arvoja väliltä -360...360
  dSlider.position(460, 20);            // Liukupalkin paikka on 460 px oikealle ja 20 px alas
  
}

function draw() {
  background(0);                        // Tyhjennä tausta ja väritä se mustaksi
  translate(width/2,width/2);           // Origo ikkunan keskelle
  var halkaisija = aSlider.value();     // Määritellään muuttuja halkaisija, joka saa arvon liukupalkilta aSlider
  var vali = bSlider.value();           // Määritellään muuttuja vali, joka saa arvon liukupalkilta bSlider
  var vari = cSlider.value();           // Määritellään muuttuja vari, joka saa arvon liukupalkilta cSlider
  var kulma = dSlider.value();          // Määritellään muuttuja kulma, joka saa arvon liukupalkilta dSlider
  stroke(255,vari,0);                   // Reunaviivan väri, jossa vihreä sävy muuttuu liukupalkin mukaan
  rotate(radians(kulma));               // Pyöritä koordinaatistoa kulman verran
  for (var a = -16; a < 16; a++) {      // Määritellään for silmukka, jossa a = -16,-15,-14,...,15
    for (var b = -16; b < 16; b++) {    // Määritellään for silmukka, jossa b = -16,-15,-14,...,15
     ellipse(a*vali,b*vali,halkaisija,halkaisija);   // Piirretään ympyrä muuttujien avulla
    }                                   // Lopeta sisempi silmukka
  }                                     // Lopeta ulompi silmukka
}