Rotate vectors in 3D

Hi there!

I did some research about this topic on this forum and in general. The subject was discussed here before but with no-code solutions for 3D. I like to address that topic again with the hope to find an easy solution that can help me and the following to come.

Let’s say I like to create a Box between two 3D vectors, therefore i have to rotate it according to the angle between V1 to V2. This thread has the same issue in 2D - WEBGL cylinder between two points.
Following that i manage to rotate the XY positions accordingly, but still not for Z.

XY rotations are correct, still missing Z rotation.

current use:

				PVector heading = new PVector(position2.x - position.x, position2.y - position.y,
						position2.z - position.z);
				PVector midpoint = PVector.lerp(position, position2, 0.5f);

				canvas.strokeWeight(2);
				canvas.noFill();
				canvas.stroke(0, 255, 0);
				canvas.line(p1.pos.x, p1.pos.y, p1.pos.z, p2.pos.x, p2.pos.y, p2.pos.z);

				canvas.stroke(255);
				canvas.pushMatrix();

				canvas.translate(midpoint.x, midpoint.y, midpoint.z);
				canvas.rotate(heading.heading() + PApplet.PI / 1.0f);
				canvas.box(heading.mag(), 5, 5);
				canvas.popMatrix();

I was also trying to play with getRotatedAroundAxis of Toxiclibs.

As noted - Any pointers will be greatly appreciated :wink:
Thanks!

1 Like

Hello, I may not have the exact solution, but you may find a simple workaround using these few lines of code:

Say you want to rotate something to face a normalized vector, v

rotateY(atan2(-v.x,-v.z));
rotateX(asin(-v.y));

works great for images that always face the camera

2 Likes

For very limited cases, you can hack 3D rotation using PVector and hope that you don’t run into gimbal lock.

As soon as you need something general-purpose, though, representing rotation state in terms of xyz has lots of known problems. Instead, use quaternions. They are complicated and it is a pain – but they actually work. The PeasyCam library has a great reference implementation.