当按新角X和Y缩放时如何找到矩形角？

Question

我有一个JS应用程序，它从左上角开始顺时针渲染一个坐标为(1,5),(3,3)(5,5),(7,3)的矩形。 如果我拖动右上角，我将得到新的 x,y，它将是 4,2，所以我的新矩形坐标将是 [1,5 ], [4,2,] [6,4][3,7]

告诉我计算这个均匀阻力是在任何角落的逻辑。需要重新计算关联点，保持形状为矩形 附上一张图方便理解，图中虚线是拖拽TR后的新线 BR 和 TL 需要计算

从新角点和旧 bbox 数据查找新坐标的 JS 代码

Answer 1

首先获取初始矩形的尺寸

w = tr.x - tl.x
h = bl.y - tl.y

移动TR创建新向量，找到它的标准化版本

dx = new_tr.x - tl.x
dy = new_tr.y - tl.y
new_w = sqrt(dx*dx+dy*dy)
udx = dx/new_w  
udy = dy/new_w  

现在

new_bl.x = tl.x - h * udy  //check signs in these two formulas
new_bl.y = tl.y + h * udx

new_br.x = new_bl.x + dx
new_br.y = new_bl.y + dy