Translating and Rotating Individual Objects in a 2d Array

Programming Questions

hndrsn6

Translating and Rotating Individual Objects in a 2d Array

in Programming Questions • 3 years ago

Hello folks,

I've been messing around with a simple enough sketch that creates a 2d array of tetrahedrons, and I want one to rotate around their own centerpoint if the mouse rolls over it - so as a mouse travels across the screen it will cause any tetrahedrons in the cursors path to begin spinning. All is working fine enough so far, apart from the old translation/rotation conflict. The first tetrahedron in the array (ie the one at x=0, y=0) rotates on it's own axis, but the further down the array you get the rotation is on a wider arc. Is there a simple way to fix this issue?

Here's my code. Feel free to make any other suggestions where necessary!

import processing.opengl.*;
int num = 18;
int edgeLength = 15;
Tetrahedron tetrahedrons[][] = new Tetrahedron[num][num];
void setup(){
size(800, 800, OPENGL);
smooth();
for(int i=0; i<num; i++){
for(int j=0; j<num; j++){
tetrahedrons[i][j] = new Tetrahedron(i*50, j*50, 0, edgeLength);
}
}
}
void draw(){
background(0);
noFill();
for(int i=0; i<num; i++){
for(int j=0; j<num; j++){
pushMatrix();
tetrahedrons[i][j].render();
popMatrix();
}
}
}
class Tetrahedron{
int x, y, z;
int edgeLength;
float theta;
boolean selected=false;
Tetrahedron(int ix, int iy, int iz, int iedgeLength){
x = ix;
y = iy;
z = iz;
edgeLength = iedgeLength;
}
void makeShape(){
stroke(255, 0, 0);
beginShape(TRIANGLE_STRIP);
vertex(edgeLength+x, edgeLength+y, edgeLength+z);
vertex(-edgeLength+x, -edgeLength+y, edgeLength+z);
vertex(-edgeLength+x, edgeLength+y, -edgeLength+z);
vertex(edgeLength+x, -edgeLength+y, -edgeLength+z);
vertex(edgeLength+x, edgeLength+y, edgeLength+z);
vertex(-edgeLength+x, -edgeLength+y, edgeLength+z);
endShape(CLOSE);
}
void render(){
switchOn();
makeShape();
}
void switchOn(){
if(selected(x, y, edgeLength)){
stroke(255, 0, 0);
beginSpin();
}else{
stroke(0, 0, 255);
}
}
void beginSpin(){
theta = frameCount/TWO_PI*0.2;
rotateX(theta);
rotateY(theta*0.5);
}
boolean selected(int x, int y, int edgeLength){
if(mouseX >= x && mouseX <= x+edgeLength &&
mouseY >= y && mouseY <= y+edgeLength){
return true;
}
else{
return false;
}
}
}

Replies(2)

blindfish

Re: Translating and Rotating Individual Objects in a 2d Array

3 years ago

To achieve what you want you'll need to re-think the structure of your code a little.

Basically to rotate around the object's origin you first need to translate() to the origin - i.e. its x/y position (this is demonstrated in the rotateX Reference page) - and you'll need to wrap this action in a pushMatrix()/popMatrix() to avoid affecting other objects... but you're also going to need to perform the drawing operation from within the Matrix transformation in order for the rendered shape to be affected. That might mean moving the code to your makeShape() method and adding a condition to generate the spin only when the mouse is over the object, rather than using your beginSpin() method... In fact I'd say the switchOn and beginSpin methods are a little superfluous. I know some OOP purists would suggest to split to many simple methods, but sometimes this creates other issues you need to work around.

You might also want to reconsider the way you calculate selected() - i.e. mouseOver. Since the object's x/y coordinates are at its centre from what I can see you're only registering mouseOver on the bottom right of the shape. A simpler approach might be to check the distance from the object's centre.

hndrsn6

Re: Re: Translating and Rotating Individual Objects in a 2d Array

3 years ago

That's great, thanks very much for the swift response :)

This is the near-finished sketch!

import processing.opengl.*;
int num = 18;
int edgeLength = 15;
Tetrahedron tetrahedrons[][] = new Tetrahedron[num][num];
void setup(){
size(800, 800, OPENGL);
smooth();
for(int i=0; i<num; i++){
for(int j=0; j<num; j++){
tetrahedrons[i][j] = new Tetrahedron(i*50, j*50, 0, edgeLength);
}
}
}
void draw(){
background(0);
noFill();
for(int i=0; i<num; i++){
for(int j=0; j<num; j++){
pushMatrix();
tetrahedrons[i][j].makeShape();
popMatrix();
}
}
}
class Tetrahedron{
int x, y, z;
int edgeLength;
float counter;
float theta, angleX, angleY, rx, ry;
boolean selected=false;
Tetrahedron(int ix, int iy, int iz, int iedgeLength){
x = ix;
y = iy;
z = iz;
edgeLength = iedgeLength;
}
void makeShape(){
translate(x, y);
theta = frameCount/TWO_PI;
float dx = x-mouseX;
float dy = y-mouseY;
float d = (sqrt(dx*dx+dy*dy));
if(d < edgeLength*2){
counter = 200;
angleX = ((theta)*0.1);
angleY = ((theta)*0.1);
stroke(200, 200, 255);
rotateY(angleX);
rotateX(angleY);
}
else{
counter-=0.5;
rx = (rx*0.95)+(angleX*0.1);
ry = (ry*0.95)+(angleY*0.1);
rotateX(rx);
rotateY(ry);
stroke(counter, counter, 255);
}
beginShape(TRIANGLE_STRIP);
vertex(edgeLength, edgeLength, edgeLength);
vertex(-edgeLength, -edgeLength, edgeLength);
vertex(-edgeLength, edgeLength, -edgeLength);
vertex(edgeLength, -edgeLength, -edgeLength);
vertex(edgeLength, edgeLength, edgeLength);
vertex(-edgeLength, -edgeLength, edgeLength);
endShape(CLOSE);
}
}