为剪切元素获取getboundingClientRect

Question

我需要获取已剪切的SVGE元素的boundingClientRect - 使用此信息，我想将HTML元素放在SVG元素的顶部。

我的SVG看起来像这样（简化，原始版本具有多个级联视口和多个级联变换）：

<svg width="96" height="80">
  <clippath id="clip">
    <path d="M 0 0 L 96 0 L 96 80 L 0 80 Z"/>
  </clippath>
  <g clip-path="url(#clip)">
    <image x="0" y="-8" width="96" height="96" xlink:href="…" transform="…"/>
  </g>
</svg>

我想将HTML元素放在SVGGElement之上。为此，我得到了

的boundingClientRect

• HTMLElement正在定位
• HTMLElements parent
• 元素？这允许我获取SVGGelement的boundingClientRect并应用Clipping

在Chrome中，这可以通过获取SVGPathElement的boundingClientRect来实现。在Opera和Firefox中，生成的clientRect的宽度和高度为0（可能是因为未显示路径元素）。无论应用的剪辑路径如何，SVGGelement本身的boundingClientRect都从包含的SVGImageElement获取其尺寸。

我尝试通过SVGUseElement引用SVGPathElement并获取它的boundingClientRect - 这似乎有效。

是否真的有必要引入另一个设置为隐藏可见性和指针事件的DOM元素：无或有人知道更好的解决方案吗？