logo标签列表

获取包括描边在内的svg尺寸

javascriptjquerysvg
4
我想把一个svg精确地放在一个div的角落里。这个svg有一个动态生成的描边。如果svg的形状是不规则的，或者说是一个星形，那么与边框最外部的距离很难计算。
如果我能够获得包括描边在内的svg尺寸，问题就可以解决。
我的想法是：
  • 加载外部svg
  • 将其放置在div的中间
  • 应用所需的描边宽度
  • 获取svg的最外部尺寸
  • 将其放置在角落里
我能否获得包括描边在内的svg宽度？还有其他的想法吗？
谢谢
1个回答
0

getBoundingClientRect 是除了自己从第一原理计算之外唯一的方法。据我所知，该方法仅在Firefox和IE9+中实现。

例如这个在Firefox上返回54。

1
我在Firefox中尝试了这个，但是我只得到了形状的尺寸而没有描边 :-( - redon
我已经添加了一个示例，显示stroke-width至少在Firefox上被包含。 - Robert Longson
只是注意到http://www.w3.org/TR/cssom-view/#the-getclientrects-and-getboundingclientrect-methods中提到，SVG元素的边界框应该是在SVG中定义的（目前不包括描边）。 - Erik Dahlström
我在规范中报告了一个错误：http://old.nabble.com/Re%3A--cssom-view--6.1-getBoundingClientRect-with-SVG-content-p32193453.html - Robert Longson
目前还没有跨浏览器的解决方案吗？ - redon
不，SVG规范目前还不支持这样做。不过我认为下一个版本的规范提出了一种方法来实现这个功能。 - Robert Longson
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接