如果从 svg 中省略，viewBox 属性的默认值是多少？

Question

我想如果我从 svg 中省略 viewBox 属性，它会被假定为 viewBox="0 0 100 100"。我尝试了两个测试：

1. 带有viewBox属性：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="svg-triangle" width='100' height='100'>
  <path d="M 50,5 95,97.5 5,97.5 z"/>
</svg>

1. 没有 viewBox 属性

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="svg-triangle" width='100' height='100' viewBox="0 0 100 100">
    <path d="M 50,5 95,97.5 5,97.5 z"/>
</svg>

由于两个结果相同，我认为我的猜测是正确的。如果从 svg 中省略，请提供一些参考来解释 viewBox 属性的默认值是什么。

Answer 1

https://www.w3.org/TR/SVG2/coords.html#ViewBoxAttribute

省略的视图框的默认值为“好像未指定”。

这里的问题有点概念性。所以与未指定的视图框等效的视图框是0 0 width height，但未指定的视图框根本不存在。一个视图框等于一个变换，如果渲染这些东西，您通常会对视图框进行等效变换并将其添加到您的矩阵中。并且未指定的视图框根本不应用任何转换。所以这个问题变成了一个未指定的transform 属性的默认值是什么。

将 SVG 对象本身视为欧几里得空间中的一个元素可能会有所帮助，就像其中的形状一样。 circle 对象（尽管不在规范范围内）可能有一个视图框。这意味着它将对圆的坐标系进行某种缩放，并使缩放后的视图等于圆的大小。所以在空间中可以有宽度和高度的所有东西都可以有一个视图框，其中一些实际上就像图像对象和嵌套的 SVG 对象一样。如果没有视图框，一切都是它在空间中实际存在的大小。在 SVG 对象本身的情况下，这意味着视图框等于在 0 0 width height 处查看它的视图，因为这是对象本身的实际大小。但是，实际上没有视图框的效果是没有效果的。实际上，等于0 0 width height 的视图框在转换为变换时最终将不应用任何缩放或平移值。但是，这可以通过简单地省略它来实现。

如果省略宽度和高度，则它们被视为等于 100%。也就是说，它们占用了用于查看它们的物理框内 100% 的空间。视口而不是视图框。