如何在FireFox中获得SVG元素的尺寸？ [英] How to get SVG element dimensions in FireFox?

问题描述

  window.onload = function（）{
 console。在大多数浏览器中， log（document.getElementById（'svgElm'）。getBoundingClientRect（）。width）; 
}; 
  

这是演示。如果您在Google Chrome中试用，则控制台将输出 200 。然而，FireFox返回 0 。

解决方案

如果无法返回SVG属性，则返回父维度。这里是一个演示 http://jsbin.com/uzoyik/1/edit 。

相关代码是：

  svg.clientWidth || svg.parentNode.clientWidth 
 svg.clientHeight || svg.parentNode.clientHeight 
  

In most browsers, the following would work.

window.onload = function(){
    console.log( document.getElementById('svgElm').getBoundingClientRect().width );
};

Here is a demo. If you try it in Google Chrome, the console will output 200. However, FireFox returns 0.

解决方案

I've ended up falling back to the parent dimensions if SVG properties cannot be returned. Here is a demo http://jsbin.com/uzoyik/1/edit.

The relavent code is:

svg.clientWidth || svg.parentNode.clientWidth
svg.clientHeight || svg.parentNode.clientHeight

这篇关于如何在FireFox中获得SVG元素的尺寸？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！