测试点是否超出平移缩放范围

Question

我想测试特定 SVG 元素的位置是在当前可见的平移缩放区域的内部还是外部。如果它在外面，那么我可以将其平移到相应的边界内。

这听起来像是一个简单的操作，除了我找不到正确的测试来查看一个点是否在可见区域之外；如果我能做到，那我就可以毫不费力地处理平底锅了。

根据原始元素 x/y 属性，我的位置是一个未转换的位置，因此我希望必须访问适当的 CTM，但我找不到它。

Answer 1

哎呀，我发问题有点仓促。 CTM 隐藏在由 pan-zoom 库创建的特定 <g> 上，以围绕您自己的 SVG 元素。

可以通过以下方式找到：

var ctm = document.getElementById("svg-id").querySelector('.svg-pan-zoom_viewport').getCTM();

其中 svg-id 是您自己的 <svg> 元素 ID。

据此，根据transforming

，很容易使用矩阵计算在新旧坐标系之间进行映射

Test if point outside pan-zoom bounds