Trigonometry calculate tilt angle from accelerometer data - javascript

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))

Related

midpoint of arc when have Lat/longs A and B and Centre and radius

I have the following Lat/long points A (centre), B (start) and C(end) and the radius (orange line)
start point is -14.421667 145.086389
end point is -16.050833 143.278056
centre point is -16.850278 145.743889
I am trying to find the lat/long value of point D.
var angle = Math.atan2(start.lat, start.lng) - Math.atan2(end.lat, end.lng);
I have tried using atan2 (but is that in regards to the X axis?, what is correct order of lat/longs in the equation?) but the value returned doesn't seem correct so struggling to get the correct angle for CAB.... should then be able to divide angle by 2 and using that angle and point b and radius can get D... correct?
Also any hints on how to handle when the CAB angle is > 180degrees?
Note: picture rotation is not quite correct for the points given)
Thank you!

Detecting mouse courser when is close to polyline

I have a programming question with some math weight. I have a map with shapes(polylines) drown on it. I can take the screen coordinates of that shapes and translate them to map coordinates and reverse. I am capturing mouse position and moving around the map. How can I recognize if I come in proximity to another shape drown on the map while I am moving the mouse. I was thinking to create a radius of points around the mouse cursor, then constantly looping trough available shapes (I imagine I can load their coordinates in arrays) for a match. However that will be very slow I think. The point is that when I am in proximity (for example 15px) I will snap the muse position to that close shape. Any suggestions?
Now - if you really want to make it perfect - you can calculate the distance of a cursor to each line segment.
For each line segment (defined by points D and E)
Calculate line formula for segment DE in format:
Ax + By + C = 0
A = D.y - E.y
B = E.x - D.x
C = (plug in point D) = -1 * (A * D.x + B * D.y)
Now plug in your cursor position to the formula:
A * cursor.x + B * cursor.y + C = YOUR DISTANCE TO THE LINE SEGMENT
*One thing - this is distance to the unbounded line. You now want to make sure that you are between the two segment points. So make sure the angles in your cursor, D, E triangle are all < 90 degrees. A number of ways to do that, look into the dot product formula to learn a fast one.
Now if anlges are less than 90, use the distance to the line, else, use the min distance to either point of segment (D & E). Now you have a complete snap to lines functionality.
If you have every point / line segment of the shapes (which you should with the polylines), here is a possible quick and simple routine:
For each shape
Figure center of shape by averaging each constituent point (i.e. - for a pentagon, add all five point.x up, divide by 5 - do same for all point.y). Call this average shape.x and shape.y. Use distance formula to figure proximity to your mouse. (Mouse.x - Shape.x)^2 + (Mouse.y - Shape.y)^2... you don't have to take the square root of that since you are only interested in the closest shape.
Keep track of the minimum distance "squared" for each shape. The minimum is your closest shape center.
If you want snap to behavior with a maximum range, just also make sure the distance squared is < pixel distance squared.
If you want to make it very effiecient, the shape centers do not need to be constantly refigured, just calculated once. The center will scale and translate the same as any other point if you are converting between screen space and other coordinates as you mentioned.

JavaScript Vector2d Math

I've recently started programming small canvas games in JavaScript and is trying to wrap my head around Vector 2d math. I understand the very basics of Vectors (like they represent a point in a 2d space with a direction and that you can add, multiply, subtract and rotate them) but I don't understand how to apply vectors when for instance calculating direction and speed of an in-game object.
Check out this game:
http://rem.im/asteroid.html
A great example of a mini game driven by 2d vector math.
The great Seb Lee Delisle is using this JavaScript pseudo class for his vector calculations:
https://github.com/sebleedelisle/JSTouchController/blob/master/js/Vector2.js
I've read some tutorials on vector math but they have a 100% pure mathematical focus and don't describe how to build games with vectors like controlling space ships and bullets.
Can you point me to some tutorials of how to apply vector math in JavaScript games?
Thanks!
You can see the position of an element as a vector (x,y) which also defines a direction going from the coordinate origin (0,0) to this point.
Velocity is the rate of position change per time unit. So for example (1,5) means that with every time unit (let's say per frame) the x coordinate will change by +1 and the y coordinate will change by +5. So the new position will be (x,y)+(1,5) = (x+1, y+5)
Acceleration is the rate of velocity change per time unit. Let's say you have an acceleration of (1,1), then the velocity will change by +1 in x direction and by +1 in y direction.
Example: Current position of your object is (100, 200), its current velocity is (5,0) and the acceleration is (1,1).
Position in frame 0: (100,200), velocity (5,0)
Position in frame 1: (100,200) + (5,0) = (105,200), new velocity (5,0) + (1,1) = (6,1)
Position in frame 2: (105,200) + (6,1) = (111,201), new velocity (6,1) + (1,1) = (7,2)
etc.

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.

How to find the middle point of an arc slice?

I have a slice of a circle (that is made of moveTo,lineTo,arc,etc) and need to find the middle point of the slice.
What is the math behind finding the point shown in the image below?
It looks "centroid" of the sector to me.
The co-ordinates of it (with x axis along the radius passing through the centroid and origin at the centre)
centroidX = (4/3)r(sin(A)/A)
centroidY = 0
where 'A' is the angle made by the arc at the centre(in radians) and 'r' is the radius.
EDIT:
This is sort of a formula which can be easily derived.
Geometric Centroid of any shape is average(weighted mean) of all it's points.
In physics, centroid(AKA centre of mass) of an object is the point at which the mass of the whole object can be assumed to be concentrated(eg, the object can be balanced on a needle at the centroid). There are formulae which can be directly used for regular shapes. For irregular shapes, it is calculated by integration.
It's basic logic is adding x co-ordinates of all the points and dividing by total no. of points, which gives x co-ordinate of the centroid and similar for y co-ordinate.
As the points on a shape are not discrete, integration is used.
Let C is center point, P1 and P2 are points at circumference, and slice angle is smaller then Pi (180 deg).
One possibility:
X = C + Radius/2 * UnitVector(P1 + P2 - 2*C)
Another:
X = 1/3 * (P1 + P2 + C)
(It depends on exact requirements)

Categories