我有一个像这样的图表:
点O位于矩形中,并取决于矩形边缘。
拖动点B(角)后,矩形变形如下:
变形后如何计算O点的坐标?
我使用JavaScript工作,所以如果可以的话,我需要一种算法。谢谢大家,抱歉英语不好!
最佳答案
首先,获取您的点在矩形中的相对位置:
posXRel =(O.x-A.x)/(B.x-A.x);
posYRel =(O.y-A.y)/(B.y-A.y);
在四边形A’B’C’D’的线上找到这些相对坐标的位置
在A’B’中:
posAB.x = A’.x + posXRel *(B’.x-A’.x);
posAB.y = A’.y + posXRel *(B’.y-A’.y);
在B’C’中:
posBC.x = B’.x + posYRel *(C’.x-B’.x);
posBC.y = B’.y + posYRel *(C’.y-B’.y);
在C’D’中:
posCD.x = C’.x + posXRel *(D’.x-C’.x);
posCD.y = C’.y + posXRel *(D’.y-C’.y);
在D’A:
posDA.x = D’.x + posYRel *(A’.x-D’.x);
posDA.y = D’.y + posYRel *(A’.y-D’.y);
现在我们想要获得从posAB到posCD的线与从posBC到posDA的线之间的交点:
为此,我们需要设置等式:
对于这两行,Y = aX + b并得到a和b。
对于从posAB到posCD的行:
a1 =(posAB.y-posCD.y)/(posAB.x-posCD.x);
b1 = posAB.y-a1 * posAB.x;
对于从posBC到posDA的行:
a2 =(posBC.y-posDA.y)/(posBC.x-posDA.x);
b2 = posBC.y-a2 * posBC.x;
最后,我们正在寻找方程的解:
a1 * O’.x + b1 = a2 * O’.x + b2;
因此,您的新坐标应为:
O’.x =(b2-b1)/(a1-a2);
O’.y = a1 * O’.x + b1;
你能告诉我它是否有效吗?