A small question, Canvas position and maths

[jdnichollsc]

Hi guys,

 

How I can find the third point?

 

 

It is simple, but can not find the solution.

 

Regards, Nicholls

[tips4design]

Let's consider the points A(x1,y1), B(x2, y2), C(x3, y3).

The edges opposite of angles are called a, b, c.

You want to find C, given A,B and a.

 

You first find b = dist(A, B )

tgA = a/b

Then find the angle of A by doing <A = Math.atan(tgA);

 

You can now find edge c: sinA = a/c   ==> c = a/sinA  ==> c = a / Math.sin(<A).

Now you have all edges length, a,b,c; You now also have all angles, B = 90,  A = <A and C = 90 - <A.

 

So, you have two points, all edges and all angles. I haven't thought further from here

[jdnichollsc]

Let's consider the points A(x1,y1), B(x2, y2), C(x3, y3).

The edges opposite of angles are called a, b, c.

You want to find C, given A,B and a.

 

You first find b = dist(A, B )

tgA = a/b

Then find the angle of A by doing <A = Math.atan(tgA);

 

You can now find edge c: sinA = a/c   ==> c = a/sinA  ==> c = a / Math.sin(<A).

Now you have all edges length, a,b,c; You now also have all angles, B = 90,  A = <A and C = 90 - <A.

 

So, you have two points, all edges and all angles. I haven't thought further from here

 

Nicee!! Thanks my friend!!

 

See my example: http://codepen.io/jdnichollsc/pen/wKwqVK?editors=011

 

Regards   

[dimumurray]

You could also approach the problem using vector math as follows:
 

What we want is the vector, lets call it V, from B(x2,y2) to C(x3, y3).

 

First consider the vector U from B(x2,y2) to  A(x1,y1) whose x,y components can be evaluated using:
 

Ux = x1 - x2;

Uy = y1 - y2;

 

 

U is perpendicular to V. Therefore V's x and y components can be written as:

Vx = -Uy;

Vy = Ux;

 

The magnitude of V has to be scaled to match the length a :

 

To scale it, first normalize the vector V (ie. make it a vector of length one by dividing its x and y components by its current length).

currentLength = Math.sqrt(Vx*Vx + Vy*Vy);
Vx = Vx/currentLength;
Vy = Vy/currentLength;

Then multiply Vx and Vy by the length a:

Vx *= a;

Vy *= a;

 

at which point we can find the point C(x3,y3) by applying the vector V to the point B(x2,y2) as follows:

x3 = x2 + Vx;

y3 = y2 + Vy;

The best part about vector calculations is that most frameworks come with APIs built in to handle them. So stuff like normalize and scaling (and other functions like dot product) are simple function calls so you won't have to write this stuff yourself.
 

[jdnichollsc]

Ohh thanks for your explanation my friend 

 

Regards, Nicholls

[dimumurray]

There is an issue that I forgot to mention. The solution I described above will have to be modified in certain cases.

 

Consider again the vector U pointing from B(x2,y2) to A(x1, y1).

 

Now imagine you're standing on a line of infinite length facing in the direction of the vector U. The line divides space into 2-regions so that point C lies to the right of you. There is also point D to your left that mirrors point C that will also be perpendicular to the vector U. 

If you were trying to find D you'd follow pretty much the same steps as before. However, the perpendicular vector V would be pointing in the opposite direction and would have to be calculate as:

 

Vx = Uy;

Vy = -Ux;

 

Instead of:

Vx = -Uy;

Vy = Ux;

Which set of calculations you use depends of where you want the perpendicular to be; to the right or to the left of vector U.