Javascript 如何使svg高度与屏幕高度匹配，无论您使用的是什么设备或屏幕大小

我需要一个svg来始终匹配屏幕的高度，而不考虑平台。 我在css中选择svg，并将高度设置为100%或高度：100vh或最小高度：100vh以及大约10种其他组合。但是当我在设备工具栏上摆弄它时，我总能找到一个它不适用的设备

尤其是Ipad

所以我不顾一切地使用了一个“onResize”事件，并使用javascript将svg的高度设置为window.innerHeight的屏幕高度

但是很明显，onResize是有缺陷的，当它调整屏幕的初始大小时，错误的时间长达一两秒。 所以我变得更加绝望，写下了这个怪物。（尽管如此）

让oldSize=0//跟踪大小
函数大小（）{
如果（window.innerHeight！=oldSize）{//如果高度与旧高度不匹配，请执行某些操作
oldSize=window.innerHeight；//将旧高度设置为新高度
$（'svg'）.attr（'height'，window.innerHeight）；//将svg的高度设置为新高度
}
setTimeout（大小，100）；//请等待十分之一秒，然后重试。
}
大小（）//开始递归的消散循环。

---

您可以在窗口调整大小事件中添加事件侦听器，而不是每100毫秒调用一次函数：

让oldSize=0//跟踪大小
函数大小（）{
log（'Resized！'）；
如果（window.innerHeight！=oldSize）{//如果高度与旧高度不匹配，请执行某些操作
oldSize=window.innerHeight；//将旧高度设置为新高度
$（'svg'）.attr（'height'，window.innerHeight）；//将svg的高度设置为新高度
}
}
window.addEventListener（'resize'，size）；
大小（）
我希望我能正确理解您的意思。在这种情况下，您不需要javascript。添加
svg{宽度：100vw；高度：100vh；}
。默认情况下SVG强制均匀缩放，圆将永远停留在SVG画布的中间。或者，您可以尝试向svg元素添加
preserveAspectRatio=“xmidymidSlice”
。这将强制进行均匀缩放，但会对图像中落在外面的部分进行切片。