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.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.translate(midpoint.x, midpoint.y, midpoint.z);
				canvas.rotate(heading.heading() + PApplet.PI / 1.0f);, 5, 5);

I was also trying to play with getRotatedAroundAxis of Toxiclibs.

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

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


works great for images that always face the camera


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.