3 pentominos "T" en 8 "Drieh_nh" vormen een gelijkzijdige achthoek. terug naar de inleiding
Met de knoppen worden draaipunten van de pentominos (dp T) en driehoeken (dp D) verandert
toets "s" stoppen van de rotaties met iedere overige toets starten de rotaties weer
schets in p5. js:
Positie draaipunt van de driehoeken = hoogte achthoek - hoogte driehoek = sqr(1.5*1.5+1.5*1.5)+1.5-1.5 = sqrt(4.5) (regel 11)
De draaipunten bevinden zich dus op de rand van een cirkel,
en de p5.js superclass "Vormen"
let vorm = []; let cirkelAan = false;
function setup() {
createCanvas(windowWidth, windowHeight);
buttonR1 = createButton('reset');
buttonR1.position(20,30);buttonR1.style('width','70px');
buttonR1.mouseClicked(buttonR1Action);
buttonT0 = createButton('dp T = 0');
buttonT0.position(20,60);buttonT0.style('width','70px');
buttonT0.mouseClicked(buttonT0Action);
buttonT1 = createButton('dp T = 1');
buttonT1.position(20,90);buttonT1.style('width','70px');
buttonT1.mouseClicked(buttonT1Action);
buttonT2 = createButton('dp T = 2');
buttonT2.position(20,120);buttonT2.style('width','70px');
buttonT2.mouseClicked(buttonT2Action);
buttonT3 = createButton('dp T = 3');
buttonT3.position(20,150);buttonT3.style('width','70px');
buttonT3.mouseClicked(buttonT3Action);
buttonT4 = createButton('dp T = 4');
buttonT4.position(20,180);buttonT4.style('width','70px');
buttonT4.mouseClicked(buttonT4Action);
buttonT5 = createButton('dp T = 5');
buttonT5.position(20,210);buttonT5.style('width','70px');
buttonT5.mouseClicked(buttonT5Action);
buttonT6 = createButton('dp T = 6');
buttonT6.position(20,240);buttonT6.style('width','70px');
buttonT6.mouseClicked(buttonT6Action);
buttonT7 = createButton('dp T = 7');
buttonT7.position(20,270);buttonT7.style('width','70px');
buttonT7.mouseClicked(buttonT7Action);
buttonT8 = createButton('dp T = 8');
buttonT8.position(20,300);buttonT8.style('width','70px');
buttonT8.mouseClicked(buttonT8Action);
buttonD0 = createButton('dp D = 0');
buttonD0.position(100,60);buttonD0.style('width','70px');
buttonD0.mouseClicked(buttonD0Action);
buttonD1 = createButton('dp D = 1');
buttonD1.position(100,90);buttonD1.style('width','70px');
buttonD1.mouseClicked(buttonD1Action);
buttonD2 = createButton('dp D = 2');
buttonD2.position(100,120);buttonD2.style('width','70px');
buttonD2.mouseClicked(buttonD2Action);
buttonD3 = createButton('dp D = 3');
buttonD3.position(100,150);buttonD3.style('width','70px');
buttonD3.mouseClicked(buttonD3Action);
buttonD4 = createButton('dp D = 4');
buttonD4.position(100,180);buttonD4.style('width','70px');
buttonD4.mouseClicked(buttonD4Action);
buttonD5 = createButton('dp D = 5');
buttonD5.position(100,210);buttonD5.style('width','70px');
buttonD5.mouseClicked(buttonD5Action);
buttonD6 = createButton('dp D = 6');
buttonD6.position(100,240);buttonD6.style('width','70px');
buttonD6.mouseClicked(buttonD6Action);
buttonCAU = createButton('cirkel aan/uit');
buttonCAU.position(20,330);buttonCAU.style('width','120px');
buttonCAU.mouseClicked(buttonCAUAction);
buttonD = createButton('downloaden');
buttonD.position(20,360);buttonD.style('width','120px');
buttonD.mouseClicked(buttonDAction);
const x = width/2; const y = height/2; const n = height/11;
let sw = n/50; let alfa = 100; let sc = color(0);
let dp = sqrt(4.5)*n;
vorm[0] = new T(n, 0, x-1.5*n, y-1.5*n, -45,color(10,255,200,alfa),sw,sc);
vorm[1] = new T(n, 0, x+1.5*n, y-1.5*n, 45,color(247,50,40,alfa), sw,sc);
vorm[2] = new T(n, 0, x+1.5*n, y+1.5*n, -225,color(50,255,121,alfa),sw,sc);
vorm[3] = new T(n, 0, x-1.5*n, y+1.5*n, 225,color(250,200,0,alfa), sw,sc);
vorm[4] = new Drieh_nh(3*n, 3*n/2, 3, x, y-dp,180,color(165,247,10,alfa),sw,sc);
vorm[5] = new Drieh_nh(3*n, 3*n/2, 3, x, y-dp,180,color(250,10,240,alfa),sw,sc);
vorm[6] = new Drieh_nh(3*n, 3*n/2, 3, x+dp,y, -90,color(252,0,246,alfa), sw,sc);
vorm[7] = new Drieh_nh(3*n, 3*n/2, 3, x+dp,y, -90,color(161,252,0,alfa), sw,sc);
vorm[8] = new Drieh_nh(3*n, 3*n/2, 3, x, y+dp, 0,color(0,0,245,alfa), sw,sc);
vorm[9] = new Drieh_nh(3*n, 3*n/2, 3, x, y+dp, 0,color(50,200,153,alfa),sw,sc);
vorm[10] = new Drieh_nh(3*n,3*n/2, 3, x-dp,y, 90,color(251,201,0,alfa), sw,sc);
vorm[11] = new Drieh_nh(3*n,3*n/2, 3, x-dp,y, 90,color(0,255,111,alfa), sw,sc);
vorm[12] = new Ellips(dp, dp, 0, x, y, 0, color(222,144,92,50),sw,sc);
}
function draw() {
clear();
background('rgba(255,255,255, 0)');
for (let i=0; i<12; i++){vorm[i].display();}
if (cirkelAan) {vorm[12].display();}
if (key == 's' || key == 'S') { }
else
{
vorm[0].dpRotLi(vorm[0]); vorm[1].dpRotRe(vorm[1]);
vorm[2].dpRotLi(vorm[2]); vorm[3].dpRotRe(vorm[3]);
vorm[4].dpRotLi(vorm[4]); vorm[5].dpRotRe(vorm[5]);
vorm[6].dpRotLi(vorm[6]); vorm[7].dpRotRe(vorm[7]);
vorm[8].dpRotLi(vorm[8]); vorm[9].dpRotRe(vorm[9]);
vorm[10].dpRotLi(vorm[10]);vorm[11].dpRotRe(vorm[11]);
}
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
}
function buttonT0Action() {for (let i=0;i<4;i++){vorm[i].d = 0}}
function buttonT1Action() {for (let i=0;i<4;i++){vorm[i].d = 1}}
function buttonT2Action() {for (let i=0;i<4;i++){vorm[i].d = 2}}
function buttonT3Action() {for (let i=0;i<4;i++){vorm[i].d = 3}}
function buttonT4Action() {for (let i=0;i<4;i++){vorm[i].d = 4}}
function buttonT5Action() {for (let i=0;i<4;i++){vorm[i].d = 5}}
function buttonT6Action() {for (let i=0;i<4;i++){vorm[i].d = 6}}
function buttonT7Action() {for (let i=0;i<4;i++){vorm[i].d = 7}}
function buttonT8Action() {for (let i=0;i<4;i++){vorm[i].d = 8}}
function buttonD0Action() {for (let i=4;i<12;i++){vorm[i].d = 0}}
function buttonD1Action() {for (let i=4;i<12;i++){vorm[i].d = 1}}
function buttonD2Action() {for (let i=4;i<12;i++){vorm[i].d = 2}}
function buttonD3Action() {for (let i=4;i<12;i++){vorm[i].d = 3}}
function buttonD4Action() {for (let i=4;i<12;i++){vorm[i].d = 4}}
function buttonD5Action() {for (let i=4;i<12;i++){vorm[i].d = 5}}
function buttonD6Action() {for (let i=4;i<12;i++){vorm[i].d = 6}}
function buttonR1Action() {setup();}
function buttonDAction() {save('T_Drieh_ani.png');}
function buttonCAUAction()
{if(cirkelAan){cirkelAan=false;}else{cirkelAan=true;}}
