计算变换原点对元素位置的影响

Question

有没有办法计算transform-origin对旋转元素的“位置”的影响（更像是相对于文档的偏移），无论角度如何？

假设我们有一个正方形100px * 100px元素，其旋转 90度，transform-origin为50px 50px 1px。从下图可以看出，旋转原点是中心。 白点表示转换起源。

但是当我们移动转换原点时，元素也会移动。如果我们按transform-origin: 51px 50px;（1px）增加转换原点的x轴，则该元素似乎移动向上 1px和向右 1px。分别在原点的y轴上，transform-origin: 50px 51px;增加（1px）会将元素向下移动 1px和向右移动 {{1 }}。因此，即使其中一个转换原点的轴值发生变化也会影响元素在两个轴上的位置。如果原点的两个值以相同的比例增加，则效果类型相互抵消或相互加强。

这是transform-origin设置为75px 75px的同一个方格，其中原点的y值的“向下” - 效果已取消x值“向上” - 效果，因此元素具有y轴保持在相同的位置。两个值的“正确” - 效果已经相加，因此与仅有单个原点值的效果（2 * 25px）相比，该元素的效果距离（25px）的两倍。

如果你知道角度（在这种情况下是transform-origin），很明显可以计算90deg对位置的影响。有人能想出一个能够以任何角度或原点进行计算的公式吗？ （如果transform-origin是例如243px -35px并且元素将被旋转 270度，那么元素的位置与其未变换状态相比将是什么？我是我很确定有可能计算出来，我只是想不出来。

我不确定我是否可以理解我的问题，所以如果您有任何疑问，请询问！