We Keep Coding

Trigonometry calculate tilt angle from accelerometer data

I have the following Figure and the equations:
Three Axis for measuring tilt
Equations for measuring tilt
The body on the Figures is a tri-axial accelerometer sensor, which measures accelaration in meters/seconds².
The goal is to calculate the tilt of the following angles using acceleration values:
ρ: angle of the X-axis relative to the ground (orange line);
Φ: angle of the Y-axis relative to the ground (orange line);
θ: angle of the Z-axis relative to the gravity (green line).
Could someone explain how to find equations 1,2 and 3 from the figure above?
Source of the equations and figure: https://www.thierry-lequeu.fr/data/AN3461.pdf
There is another similar and more detailed source that uses the same equations, but I also could not understand how to find them: https://www.analog.com/en/app-notes/an-1057.html
I have already implemented them and it is working, I just want help to understand how to obtain the equations. Here is the code:
let pitch = Math.atan(ax / Math.sqrt((Math.pow(ay,2) + Math.pow(az,2))) );
let roll = Math.atan(ay / Math.sqrt((Math.pow(ax,2) + Math.pow(az,2))) );
let theta = Math.atan(Math.sqrt((Math.pow(ax,2) + Math.pow(ay,2))) /az);
Thanks in advance.

This is the Pythagorean theorem, finding the 2D distance between 0,0 and a point represented by the two numbers given. If we assign that to a new function it may be clearer:
distance(a, b) { return sqrt((pow(a,2) + pow(b,2))) }
Then angles are calculated by using the inverse tangent function with a distance from that function representing one side of the triangle. For example, the pitch in your question divides the x acceleration by the distance between 0,0 and the acceleration in the YZ plane.
pitch = atan(x / distance(y, z))

Get rotation from camera matrix of format x y z w

I have a 4x4 matrix within JS called world to obj. This matrix I assume from context must be the camera transformations matrix and thus I am trying to extract the rotation from it in radians on x y and z axis.
I have no clue where to start and have tried many things
for context this below image it the camera transformations with no rotation
This second one is with rotation of 1 radian is applied to each axis. it is important to note that this camera is orbiting as well in this example

Using atan2 with offset circle

I am trying to calculate the Arc Length, so that I can color my circle border given the Arc Length.
Users can click on the circle edge and the code should automatically calculate the Arc Length from position y=radius x=cx. Given the function atan2(), I cannot achieve this successfully, because if I understand correctly, atan2 return the angle between positive X-axis and the ray from my center of circle towards the point clicked. But I need the angle between the point clicked and the y-axis.
I am attaching the picture, in case it will make more sense:
What I have currently is:
// Calcualte the deltas for point X and Y which are required for atan2 function
let deltaX = event.pageX - this.centerX
let deltaY = event.pageY - this.centerY
// The Math.atan2() function returns the angle in the plane (in radians) between the positive x-axis and the ray from (0,0) to the point (x,y), for Math.atan2(y,x)
let angleRadian = Math.atan2(deltaY, deltaX)
// Apply formula to calculate Arc length
let arcLength = radius * angleRadian
I am aware that atan2 calculates the angle as I described above, but I do not know how to modify my code to achieve what I need it to do - that is, get the angle between the Point Clicked and the y-axis.

Just swap atan2 arguments to get angle from OY axis.
For counterclockwise (CCW) system:
let angleRadian = Math.atan2(deltaX, deltaY)
(based on formulas cos(a)=sin(Pi/2-a), sin(a)=cos(Pi/2-a))
For clockwise (CW) system, where OY axis direction is down:
let angleRadian = Math.atan2(deltaX, -deltaY)

Polar coordinates and circular player scrub

I'm having issues positioning the cursor at the right point in this circular time scrubber:
I'm calculating angle with simple formula: Math.atan2(y, x).
This gives me the angle in radians, then I map it to a range [0, 1].
This range updates the player progress which is binded back to the cursor position (simple bi-directional binding).
What I need to do is just have angle = 0rad, when mouse.x = 0 and mouse.y >= radius.
Right now angle is set to 0 when I'm at mouse.x >= rootRadius, and mouse.y = 0.
This image perhaps add more insight, I'm having difficult explaining it in a simple manner, however this should be progress/angle = 0:

How do I calculate the rotation along the y-axis given a 2D direction vector?

I'm making a 3D game, and I need the player mesh always facing the back of the camera. I already figured out how to get a 2D speed vector (direction along the x-z plane), but now I need to rotate the mesh in the speed vector's direction...
Basically, every mesh has a .rotation property, and that property is a 3D vector. I am only interested in rotation over the y-axis, that's the one that is perpendicular to the surface (x-z) plane.
The rotation doesn't use degrees, but radians, so I thought it would be something like this:
mesh.rotation.y = (mesh.direction.x - mesh.direction.z)*Math.PI*2;
But this doesn't seem to cut it...
The direction/speed is a, as a said, 2D vector, and it consist of real numbers between -1 and 1. At all times sqrt(x*x + y*y) == 1, so it forms a "circle", this is because speed needs to be equal in all directions, obviously.
The speed vector changes only when I drag the mouse over the screen, and so should the rotation, and it is calculated like this:
var c = Math.sqrt(cameraPos.x*cameraPos.x + cameraPos.z*cameraPos.z); //This is the distance from the camera to the mesh, which is at (0, 0) for simplicity of this presentation.
var rat = 1/c;
mesh.direction.x = cameraPos.x*rat; //Direction vector = the speed vector
mesh.direction.z = cameraPos.z*rat;

If I understand correctly, atan2 will do the trick:
mesh.rotation.y = Math.atan2(mesh.direction.z, mesh.direction.x)
Result is in radians. It basically calculates the angle between the vector and X axis. You might need to switch parameters or use minus operator here or there.