从原始和缩放框计算变换原点

时间:2012-12-12 10:26:03

标签: css3 transform

基于原始rect1(x1,y1,w1,h1)和已知缩放的rect2(x2,y2,w2,h2),找出使用什么变换原点的公式是什么?我需要一个可重复使用的公式,因为rect2可以放在任何地方。

换句话说,我知道一个小矩形的边界,并希望它通过应用正确的变换原点坐标(在px或%中)转换到更大的矩形。

1 个答案:

答案 0 :(得分:2)

以简单的比例,距离x1 - >之间的比率。 tx和tx - > (x1 + w1)变换原点的x坐标为tx,在刻度后保持不变。用词来说:

(tx-x1)/ w1 =(tx-x2)/ w2

求解tx,你得到:

tx =(w2 /(w2-w1))*(x1 - (x2 * w1)/ w2)

类似的公式将产生你的ty。

(注意,如果你使用带有az变换的透视,那么这个公式将是错误的,如果你不知道你的透视原点,那么我相信结果将是不确定的,因为会有无限的透视组合原点和变换原点将产生相同的结果。如果你确实知道透视原点,那么数学仍然非常复杂。)