Question

我使用代码获取边界框的宽度：

document.getElementById("dataId").getBBox().width;

这将返回带有输入id的边界框的宽度。这在所有浏览器（Chrome，firefox21，IE7）中都能正常工作，但在IE10中却没有。在IE10中，它返回值0。

这是我在jsfiddle中创建的示例。请检查一下。 http://jsfiddle.net/L82rn/

我很好奇IE10和svg getBBox方法之间是否存在兼容性问题，如果有任何问题，请告诉我。

Answer 1

引自this thread中的规范，我认为这是

请注意，getBBox必须在调用方法时返回实际的边界框，即使元素尚未呈现也是如此。

＆＃34;即使在元素尚未呈现的情况下＆＃34;似乎是IE的关键点，一年后这个问题在IE11上持续存在。我可以从经验中看到的唯一另一种可能性是，根据规范，g标签没有明确的宽度和高度IE可能只是完全超出此检查，因为在＆＃34;中没有宽度＆＃34;可能与IE代码库的0相同。

因此，解决方法是寻找最大的孩子。在您的特定情况下，作为解决方法，您可以在将其添加到g标记时抓取lastChild。更改小提琴中的JS代码（我修复了svgns的内容，正如Thomas W在评论中提到的那样）。

var temp;
temp = document.createElementNS("http://www.w3.org/2000/svg","text");
temp.appendChild(document.createTextNode(".."));
temp.setAttribute("x",38); 
temp.setAttribute("y",18);
document.getElementById("tata").appendChild(temp);
alert(document.getElementById("tata").lastChild.getBBox().width);

正如你所看到的那样，只是我在lastChild之前改变了getBBox()的最后一行，应该警告8而不是0现在作为Firefox和你的其他人浏览器确实。

可缩放矢量图形（SVG）：getBBox（）在Internet Explorer 10中不起作用

1 个答案: