ellipsen en driehoeken

Schets met roterende ellipsen en driehoeken in p5.js. terug naar de inleiding

de "s" toets stopt de rotaties de overige toetsen starten de rotaties weer

ellipsen en driehoeken in fullscreen

De schets maakt gebruik van de p5.js superclass, "Vormen" en van de p5.js subclasses "Drieh_nh", en "Ellips".

De rechthoekige driehoek heeft als basis 2*n en als hoogte n

De gelijkbenige driehoek heeft als basis n en als hoogte 2*n , zo zijn de hoogten van de driehoeken gelijk aan de stalen van de ellipsen

 

let vorm =[]; zwartwit = false;
function setup() {
  buttonR1 = createButton('reset');
  buttonR1.position(20,30);buttonR1.style('width','70px');
  buttonR1.mouseClicked(buttonR1Action);
  buttonZW = createButton('zwart/wit');
  buttonZW.position(20,60);buttonZW.style('width','120px');
  buttonZW.mouseClicked(buttonZWAction);
  buttonD = createButton('downloaden');
  buttonD.position(20,90);buttonD.style('width','100px');
  buttonD.mouseClicked(buttonDAction);
  createCanvas(windowWidth, windowHeight);
  let x=width/2 , y=height/2 , n=height/5 , alfa=100, sw=n/100, sc=color(0);
  vorm[0]  = new Ellips(n, n*2,    3, x-n, y, 45,color(222,144,92,alfa),sw,sc);
  vorm[1]  = new Ellips(n, n*2,    1, x+n, y,-45,color(222,144,92,alfa),sw,sc);
  vorm[2]  = new Drieh_nh(n*2,n*2, 5, x-n, y, 45,color(0,  255, 0,alfa),sw,sc);
  vorm[3]  = new Drieh_nh(n*2,n*2, 1, x+n, y,-45,color(0,  255, 0,alfa),sw,sc);
  vorm[4]  = new Ellips(n,    n,   0, x,   y,  0,color(222,144,92,alfa),sw,sc);
  vorm[5]  = new Drieh_nh(n*2,n,   6, x,   y,180,color(255, 29, 0,alfa),sw,sc);
}
function draw() {
  if (zwartwit) {background(0)}
  else {clear(); background('rgba(255,255,255, 0)');}
for (let i = 0; i < 6; i++){vorm[i].display()}
 
if (key == 's' || key == 'S') { }
 else {
  vorm[0].dpRotLi(vorm[0]); vorm[2].dpRotRe(vorm[2]);
  vorm[3].dpRotLi(vorm[3]); vorm[1].dpRotRe(vorm[1]);
  }
}
 
function buttonR1Action(){setup();}
function buttonZWAction()
  {if(zwartwit){zwartwit = false;} else {zwartwit=true;}}
function buttonDAction(){save('ellipsen_driehoeken.png');}

Flevopink