zestien spiralen vormen een vierkant 2 in p5.js . terug naar de inleiding
Met de "s" toets stoppen de rotaties met iedere andere toets starten de rotaties weer.
16 roterende spiralen in fullscreen
De schets maakt gebruik van objecten van de p5.js class "Spiraal_8gr_gk" en de p5.js superclass "Vormen"
de spiraal is afgeleid van de gouden rechthoek
vorm = []; let n; let x; let y;
let zwartwit = false; let sliderAan = true;
function setup() {
buttonR = createButton('reset');
buttonR.position(20,40);buttonR.style('width','70px');
buttonR.mouseClicked(buttonRAction);
button0x = createButton('x=0');
button0x.position(20,80);button0x.style('width','70px');
button0x.mouseClicked(button0xAction);
button0y = createButton('y=0');
button0y.position(100,80);button0y.style('width','70px');
button0y.mouseClicked(button0yAction);
button2x = createButton('x=n/2');
button2x.position(20,120);button2x.style('width','70px');
button2x.mouseClicked(button2xAction);
button2y = createButton('y=n/2');
button2y.position(100,120);button2y.style('width','70px');
button2y.mouseClicked(button2yAction);
button4x = createButton('x=n');
button4x.position(20,160);button4x.style('width','70px');
button4x.mouseClicked(button4xAction);
button4y = createButton('y=n');
button4y.position(100,160);button4y.style('width','70px');
button4y.mouseClicked(button4yAction);
buttonphi = createButton('n*phi');
buttonphi.position(20,200);buttonphi.style('width','70px');
buttonphi.mouseClicked(buttonphiAction);
buttonphi2 = createButton('n/2*phi');
buttonphi2.position(100,200);buttonphi2.style('width','70px');
buttonphi2.mouseClicked(buttonphi2Action);
buttonb2 = createButton('2 bogen');
buttonb2.position(20,240);buttonb2.style('width','70px');
buttonb2.mouseClicked(buttonb2Action);
buttonb4 = createButton('4 bogen');
buttonb4.position(100,240);buttonb4.style('width','70px');
buttonb4.mouseClicked(buttonb4Action);
buttonb6 = createButton('6 bogen');
buttonb6.position(20,280);buttonb6.style('width','70px');
buttonb6.mouseClicked(buttonb6Action);
buttonb8 = createButton('8 bogen');
buttonb8.position(100,280);buttonb8.style('width','70px');
buttonb8.mouseClicked(buttonb8Action);
buttonRC = createButton('random kleur');
buttonRC.position(20,320);buttonRC.style('width','100px');
buttonRC.mouseClicked(buttonRCAction);
if (sliderAan) {
slidersw = createSlider(2, 50, 2, 1);
slidersw.position(20,360);
slidersw.style('width', '80px');
sliderAan = false;
}
buttonZW = createButton('zwart<->wit');
buttonZW.position(20,400);buttonZW.style('width','110px');
buttonZW.mouseClicked(buttonZWAction);
buttonD = createButton('downloaden');
buttonD.position(20,440);buttonD.style('width','110px');
buttonD.mouseClicked(buttonDAction);
createCanvas(windowWidth, windowHeight);
x = width/2; y = height/2;
n = height/6;let vierk = n; let sw = n/100;
let lr1 = 0; let lr2 = 1; let c = color(0);
//kwadrant 1
vorm[1] = new Spiraal_8gr_gk(n, lr1,8, x+n, y-n,-90,sw,c);
vorm[2] = new Spiraal_8gr_gk(n, lr2,8, x+n, y-n,180,sw,c);
vorm[3] = new Spiraal_8gr_gk(n, lr1,8, x+n, y-n,180,sw,c);
vorm[4] = new Spiraal_8gr_gk(n, lr2,8, x+n, y-n,-90,sw,c);
//kwadrant 2
vorm[5] = new Spiraal_8gr_gk(n, lr1,8, x-n, y-n,180,sw,c);
vorm[6] = new Spiraal_8gr_gk(n, lr2,8, x-n, y-n, 90,sw,c);
vorm[7] = new Spiraal_8gr_gk(n, lr1,8, x-n, y-n, 90,sw,c);
vorm[8] = new Spiraal_8gr_gk(n, lr2,8, x-n, y-n,180,sw,c);
//kwadrant 3
vorm[9] = new Spiraal_8gr_gk(n, lr1,8, x-n, y+n, 90,sw,c);
vorm[10]= new Spiraal_8gr_gk(n, lr2,8, x-n, y+n, 0,sw,c);
vorm[11]= new Spiraal_8gr_gk(n, lr1,8, x-n, y+n, 0,sw,c);
vorm[12]= new Spiraal_8gr_gk(n, lr2,8, x-n, y+n, 90,sw,c);
//kwadrant 4
vorm[13]= new Spiraal_8gr_gk(n, lr1,8, x+n, y+n, 0, sw,c);
vorm[14]= new Spiraal_8gr_gk(n, lr2,8, x+n, y+n,-90,sw,c);
vorm[15]= new Spiraal_8gr_gk(n, lr1,8, x+n, y+n,-90,sw,c);
vorm[16]= new Spiraal_8gr_gk(n, lr2,8, x+n, y+n, 0, sw,c);
}
function draw() {
if (zwartwit) {background(0)}
else {clear(); background('rgba(255,255,255, 0)');}
lijndikte()
for (let i = 1; i < 17; i++)
{
vorm[i].display()
}
if (key == 's' || key == 'S') { }
else {
//kwadrant 1
vorm[1].dpRotLi(vorm[1]);vorm[2].dpRotRe(vorm[2]);
vorm[3].dpRotRe(vorm[3]);vorm[4].dpRotLi(vorm[4]);
//kwadrant 2
vorm[5].dpRotLi(vorm[5]);vorm[6].dpRotRe(vorm[6]);
vorm[7].dpRotRe(vorm[7]);vorm[8].dpRotLi(vorm[8]);
//kwadrant 3
vorm[9].dpRotLi(vorm[9]); vorm[10].dpRotRe(vorm[10]);
vorm[11].dpRotRe(vorm[11]);vorm[12].dpRotLi(vorm[12]);
//kwadrant 4
vorm[13].dpRotLi(vorm[13]);vorm[14].dpRotRe(vorm[14]);
vorm[15].dpRotRe(vorm[15]);vorm[16].dpRotLi(vorm[16]);
}
}
function buttonRAction() {setup();}
function button0xAction(){for(let i=1; i<17; i++){vorm[i].x=x;}}
function button0yAction(){for(let i=1; i<17; i++){vorm[i].y=y;}}
function button2xAction()
{for(let i=1; i<5; i++){vorm[i].x=x+n/2;}
for(let i=5; i<13;i++){vorm[i].x=x-n/2;}
for(let i=13;i<17;i++){vorm[i].x=x+n/2;}}
function button2yAction()
{for(let i=1; i<9; i++){vorm[i].y=y-n/2;}
for(let i=9; i<17;i++){vorm[i].y=y+n/2;}}
function button4xAction()
{for(let i=1; i<5; i++){vorm[i].x=x+n;}
for(let i=5; i<13;i++){vorm[i].x=x-n;}
for(let i=13;i<17;i++){vorm[i].x=x+n;}}
function button4yAction()
{for(let i=1; i<9; i++){vorm[i].y=y-n;}
for(let i=9; i<17;i++){vorm[i].y=y+n;}}
function buttonphiAction()
{for(let i=1; i<9; i++){vorm[i].y=y-n;}
for(let i=9; i<17;i++){vorm[i].y=y+n;}
for(let i=1; i<5; i++){vorm[i].x=x+n*(1+sqrt(5))/2;}
for(let i=5; i<13;i++){vorm[i].x=x-n*(1+sqrt(5))/2;}
for(let i=13;i<17;i++){vorm[i].x=x+n*(1+sqrt(5))/2;}}
function buttonphi2Action()
{for(let i=1; i<9; i++){vorm[i].y=y-n/2;}
for(let i=9; i<17;i++){vorm[i].y=y+n/2;}
for(let i=1; i<5; i++){vorm[i].x=x+n/2*(1+sqrt(5))/2;}
for(let i=5; i<13;i++){vorm[i].x=x-n/2*(1+sqrt(5))/2;}
for(let i=13;i<17;i++){vorm[i].x=x+n/2*(1+sqrt(5))/2;}}
function buttonb2Action(){for(let i=1; i<17; i++){vorm[i].r = 2;}}
function buttonb4Action(){for(let i=1; i<17; i++){vorm[i].r = 4;}}
function buttonb6Action(){for(let i=1; i<17; i++){vorm[i].r = 6;}}
function buttonb8Action(){for(let i=1; i<17; i++){vorm[i].r = 8;}}
function buttonRCAction(){for (let i=1; i<17; i++)
{vorm[i].c = color(random(0,200),random(0,200),random(0,250));}}
function lijndikte(){let slider = slidersw.value();
for (let i=1; i<17; i++){vorm[i].sw = slider}};
function buttonZWAction()
{if(zwartwit){zwartwit = false;} else {zwartwit = true;}}
function buttonDAction(){save('zestien_spiralen2.png');}