如何将DOM坐标转换为SVG坐标?



我正试图转换dom坐标,我从ontouch事件(clientXclientY更具体),但我不明白我怎么能做到这一点。

我看了看这个例子,我发现:https://codepen.io/ehsanjso/pen/xNZgPE?editors=1010而我一点也不懂。

如果DOM和SVG具有相同的尺寸,则以像素和百分比表示的坐标是相同的。如果一个比另一个大/小,则坐标的百分比相同,像素不同。计算X尺寸的示例:

示例1

  • DOM的宽度为200
  • SVG元素的宽度为200
  • 点在DOM在x: 50 =>在SVG中指向x: 50 (25%)
  • 示例2

  • DOM的宽度为200
  • SVG元素的宽度为100
  • 点在DOM在x: 50 =>在SVG中指向x: 25 (25%)

分子式:target_width * (point / width)

我希望这有助于理解基础知识,解释您提供的整个示例有点超出范围

最新更新