Javascript 检索svg的纵横比<；图像>；

TLDR； 给定此svg元素：

<image width="30" height="48" x="3.75" y="6" href="http://some/image.jpg">

如何检索图像的实际高度和宽度（部分由图像的纵横比定义）

---

我有一个d3js脚本，它绘制了一堆

s和一堆

s。 现在，东西被布置成图像落在矩形内，就好像矩形是边界一样。直肠内还有其他东西

现在每个图像都有自己独特的长宽比，这让我很困扰，因为这意味着每个矩形都有不同数量的空白。这不整洁

为了避免这种情况，我想加载图像，然后获得实际的图像尺寸，然后调整周围物品的位置和大小。问题的关键是获取实际的图像大小。我该怎么做

---

我在谷歌上搜索了一下，花了一些时间在调试控制台上，但没有结果。什么都没发生。我会继续搜寻，但有个答案会很好

这是我能想到的最好的了。如果没有更简单的方法，我会感到惊讶和恐惧。无论如何：

添加普通html

使用js获取图像的高度和宽度
删除额外的html
虽然很难看，但很有效

下面是一些代码：

var oImage = document.createElement("img");
oImage.setAttribute("src",sUrl);
document.body.appendChild(oImage);
var iWidth = oImage.width;
var iHeight = oImage.height;
oImage.remove();

首先，仅设置宽度属性，保持高度未指定。
然后，调用图像元素的getBBox。
请注意，图像框在SVG正确渲染后可用

const image = parent.append('image').attr('xlink:href', url).attr('width', 100);
setTimeout(() => {
    const box = image.node().getBBox();
    const ratio = box.width / box.height;
}, 0);