Question

我对svg和javascript很陌生，尽管在其他编码方面经验丰富，所以请保持友好。我试图弄清楚如何在显示svg图像之前获取尺寸。

有关更多信息，请想象一个很大的svg文件，它是一栋非常大的建筑物的平面图，以及其他几个svg文件，其中包含建筑物中每个房间的详细信息。我不会提前知道文件的大小，但是我需要确保文件在窗口（iframe）中显示整个内容。我正在使用的一个文件大约是14000 x 13000，另一个大约是1000 x 3000，另一个大约是1200 x300。我无法控制文件，也无法编辑它们，所以我试图弄清楚确定实际尺寸是多少，以便我可以适当地设置viewBox属性。

对于大文件，我的javasript中包含以下内容：

var wholeMap = document.getElementById("building");
wholeMap.setAttribute("width","100%");
wholeMap.setAttribute("height","100%");
wholeMap.setAttribute("viewBox","550 715 12960 12350");

它基本上可以正常工作，但是弄清楚究竟要为viewBox设置使用什么是一个手动且艰苦的过程。我需要能够以编程方式解决问题。

我尝试像这样使用getBoundingClientRect将高度和宽度输出到控制台：

console.log("getBoundingClientRect().width = " + wholeMap.getBoundingClientRect().width);
console.log("getBoundingClientRect().height = " + wholeMap.getBoundingClientRect().height);

但是我得到的结果如下，这当然不是我期望的，而且似乎也不是我所需要的：

getBoundingClientRect（）。width = 1027.2000732421875

getBoundingClientRect（）。height = 1027.2000732421875

有什么建议吗？

在视口中绘制之前，如何使用javascript获取svg对象的尺寸？

0 个答案: