假设我有以下 document (fiddle) :
<svg>
<g transform="translate(50,50)">
<rect width="20" height="20" style="fill:black;">
</g>
</svg>
如果我不知道 rect 元素在一个组中,我如何获取它的全局坐标?
最佳答案
其实有点难找。搜索 SVGElement
的方法会导致页面显示 SVGElement
没有方法!它实际上有很多方法,但它们是继承的:
http://www.w3.org/TR/SVG/types.html#InterfaceSVGLocatable
根据您的需要,您可以使用 getCTM
或 getScreenCTM
的结果来转换 SVGPoint
,从而了解您的元素在哪里:
root = document.getElementById('root')
rec = document.getElementById('rec')
point = root.createSVGPoint()
# This is the top-left relative to the SVG element
ctm = rec.getCTM()
console.log point.matrixTransform(ctm)
# This is the top-left relative to the document
ctm = rec.getScreenCTM()
console.log point.matrixTransform(ctm)
关于javascript - 如何获取分组 svg 元素的全局坐标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17817790/