xxxxxxxxxx
79
let angleX = 0;
let angleY = 0;
let posX, posY, velocityX, velocityY;
let radius = 100;
let columns = 8; // number of checker columns
let rows = 8; // number of checker rows
function setup() {
createCanvas(400, 400, WEBGL);
posX = 0;
posY = 0;
velocityX = 2;
velocityY = 1.5;
}
function draw() {
background(200);
// Draw grid
stroke(150, 0, 150);
strokeWeight(1);
for (let i = -200; i <= 200; i += 20) {
line(i, -200, i, 200); // Vertical grid lines
line(-200, i, 200, i); // Horizontal grid lines
}
// Rotate and draw ball
push();
translate(posX, posY, 0);
rotateX(angleX);
rotateY(angleY);
drawBoingBall();
pop();
// Ball movement
posX += velocityX;
posY += velocityY;
if (posX + radius > 200 || posX - radius < -200) {
velocityX *= -1;
}
if (posY + radius > 200 || posY - radius < -200) {
velocityY *= -1;
}
// Ball rotation
angleX += 0.03;
angleY += 0.04;
}
function drawBoingBall() {
noStroke();
// Loop over each checker section
for (let i = 0; i < columns; i++) {
let theta1 = map(i, 0, columns, 0, TWO_PI);
let theta2 = map(i + 1, 0, columns, 0, TWO_PI);
for (let j = 0; j < rows; j++) {
let phi1 = map(j, 0, rows, 0, PI);
let phi2 = map(j + 1, 0, rows, 0, PI);
// Checkered pattern logic
if ((i + j) % 2 === 0) {
fill('red');
} else {
fill('white');
}
beginShape();
vertex(radius * sin(phi1) * cos(theta1), radius * sin(phi1) * sin(theta1), radius * cos(phi1));
vertex(radius * sin(phi2) * cos(theta1), radius * sin(phi2) * sin(theta1), radius * cos(phi2));
vertex(radius * sin(phi2) * cos(theta2), radius * sin(phi2) * sin(theta2), radius * cos(phi2));
vertex(radius * sin(phi1) * cos(theta2), radius * sin(phi1) * sin(theta2), radius * cos(phi1));
endShape(CLOSE);
}
}
}