Javascript 缩放后如何计算旋转图像位置

我查阅了很多类似问题的答案，但没有找到任何真正适合我的答案。我的问题很简单，我有两张图片占据了完全相同的位置，但是它们的角度不同。当我放大或缩小时，图像应该仍然彼此占据相同的位置，但是，旋转的图像总是移动的

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<style>
    .building {
        width:40px;
        height:40px;
        position:absolute;
        left:100px;
        top:100px;
    }
</style>
<div style="display:flex;justifty-content:space-evenly;width:80%;">
    <div id="container" style="position:relative;width:200px;height:200px;border:1px solid red;">
        <img src="image1.png" class="building">
        <img src="image2.png" class="building" style="transform:rotate(45deg);">
    </div>
    <div>Scale:<input id="scale" type="text" onChange="changeScale(this.value)"></div>
</div>
<script>
    var oldScale = 1;
    
    function changeScale(_scale) {
        var zoom = _scale;
        var zdelta = (_scale/oldScale);
        oldScale=_scale;
        
        var w = $("#container").width();
        var h = $("#container").height();
        $("#container").width(w*zdelta);
        $("#container").height(h*zdelta);
        
        $(".building").each(function() {
            var p = $(this).position();
            w = $(this).width()*zdelta;
            h = $(this).height()*zdelta;
            var r = getCurrentRotation(this);
        
            $(this).css({top: (p.top*zdelta), left: (p.left*zdelta)});
            $(this).width(w);
            $(this).height(h);
        });
    }
</script>

以及Math.sqrt（Math.pow（w/2,2）+Math.pow（h/2,2））

---

注意：我已经尝试通过使用具有相同大小图像的正方形的中心位置来简化问题。实际应用程序中的图像位于任何位置，它们的大小会有所不同，但它们需要保留相对于正方形中其他图像的精确位置。

因此，由于我无法找到解决此问题的良好数学解决方案，我最终做了以下工作：

var r = getCurrentRotation(this);
$(this).css({transform:"rotate(0deg)"});
var p = $(this).position();
var w = $(this).width()*zdelta;
var h = $(this).height()*zdelta;
$(this).css({top:p.top*zdelta,left:p.left*zdelta,transform:"rotate(+"r+"deg)"});

本质上，我将旋转设置为0，然后缩放图像并重新定位图像，并将其旋转设置回其原始角度。

$（this）.css（{top:（p.top*zdelta）+（（h/2）*Math.cos（r）），left:（p.left*zdelta）+（w/2）*Math.sin r））

最接近正确，但当大小增加四倍时，仍然会减少8.889。javascript可能会碰巧截断一个值吗？

var r = getCurrentRotation(this);
$(this).css({transform:"rotate(0deg)"});
var p = $(this).position();
var w = $(this).width()*zdelta;
var h = $(this).height()*zdelta;
$(this).css({top:p.top*zdelta,left:p.left*zdelta,transform:"rotate(+"r+"deg)"});