如何计算转换后的容器中新项目的位置

Question

我正在从侧边栏拖动一个占位符项（相对于窗口），并将其放到使用CSS变换的可平移/可缩放的“舞台”上。

从视觉上讲，在放下时，应将其替换为在平移/缩放的“舞台”中完全位于同一位置的绝对位置的新元素。

我已经接近了，但是计算的位置仅在比例尺为1时才是正确的，而且我无法弄清楚如何以编程方式说明比例尺。

JSFiddle： http : //jsfiddle.net/a4v2guvt/

如果缩小（鼠标滚轮）并将一个项目拖到舞台上，很容易看到问题。

这是我当前正在使用的：

$(theNewItem).css({
      'top': dropPosition.top + (currentY - (currentY * 2)),
      'left': dropPosition.left + (currentX - (currentX * 2))
    });`

关于代码的注释： dropPosition是“拖放”时被拖动元素（相对于窗口）的$.offset() ， currentY和currentX是我尝试的容器元素的转换后的x，y值添加新元素，在scale(1)处相对于窗口可以将其视为0,0。

旁注： (currentY - (currentY * 2)是我很笨拙的将转换矩阵中使用的负数转换为正数的方法，因为我不知道还有其他方法可以将+/-从头顶转换为正数。

Answer 1

终于明白了（不要问我如何！）

这是可能遇到此问题的其他任何人的解决方案：

'top': (dropPosition.top - containerPosition.top) / currentScale,
'left': (dropPosition.left - containerPosition.left) / currentScale