Verander met de re muisknop Xpos en Ypos van de camera. (regel 20)
Verander met de middelste muisknop Xpos en Ypos samen met Xdir en Ydir, omdat upX en upY = 1 is de kamera hier ook 45 graden gedraaid. (regel 23)
camera bewegingen. terug naar de inleiding
argumenten van de camera: camera(Xpos, Ypos, Zpos, Xdir, Ydir, Zdir, upX, upY, upZ); , pos = positie, dir = richting
upX, upY, upZ is een 3d vector, met (0,0,0) is de camera nergens op gericht er is dus geen beeld te zien.
De schets maakt als achtergrond gebruik van het object ruitjespap van de class "WEBGLRuitjes"
let x; let y; let z; let n; let gradhoek = 1; gradhoek2 = 1;
function setup() {
createCanvas(windowWidth, windowHeight,WEBGL);
n = height/15;
x = 0; y = 0; z = 0;
ruitjespap = new WEBGLRuitjes(n, x, y);
}
function draw() {
background('#E6FBFF');
ruitjespap.display();
camera(x, y, z+13*n, x, y, z, 0, 1, 0);
let camx = map(mouseX, 0, width, -5*n, 5*n);
let camy = map(mouseY, 0, height, -5*n, 5*n);
if (mouseIsPressed) {
if (mouseButton === LEFT) {
camera(camx, camy, z+13*n, x, y, z, 0, 1, 0);
}
if (mouseButton === CENTER) {
camera(camx, camy, z+13*n, camx, camy, z, 1, 1, 0);
}
}
fill(150,150,10,100);
push();
rotateX(radians(gradhoek));
gradhoek -= 1;
if (gradhoek < -360) gradhoek = 1;
translate(x-5*n, y, z+2*n);
box(2*n);
pop();
fill(250,100,10,100);
push();
rotateX(radians(gradhoek2));
gradhoek2 += 1;
if (gradhoek2 > 360) gradhoek2 = 1;
translate(x+5*n, y, z);
box(4*n);
pop();
push();
rotateX(radians(45));
rotateY(radians(45));
box(2*n);
pop();
}