6

我正在开发一个使用 IMG 标签来显示 SVG 文件的移动网站。SVG 文件大约 500 kB。该图像在 Firefox 和 Chrome 的 Android 版本中呈现正常。然而,在 iOS Safari 中,我只看到了一个可怕的蓝色小盒子,里面有一个问号。

我知道 iOS 中图像文件的大小是有限制的。根据 Apple 的Safari Web 内容指南

对于 RAM 小于 256 MB 的设备,解码的 GIF、PNG 和 TIFF 图像的最大大小为 3 兆像素,对于 RAM 大于或等于 256 MB 的设备,最大大小为 5 兆像素。

也就是说,对于 RAM 小于 256 MB 的设备,请确保 width * height ≤ 3 * 1024 * 1024。请注意,解码后的大小远大于图像的编码大小。

我想 SVG 文件的大小有一些限制,但由于它们是矢量化的,所以用解码的像素来描述它们的大小并没有什么意义。有谁知道 SVG 文件的限制是如何确定的?

PS当我直接浏览SVG文件而不是通过HTML页面时,我可以查看图像。我还可以在 IFRAME 中查看 SVG 文件。但不使用 IMG 标签。

4

1 回答 1

8

我制作了一些不同大小的测试 SVG 文件。它们看起来像这样:

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="2000" height="2000" xmlns="http://www.w3.org/2000/svg">
    <text x="100" y="100" font-size="50">2000x2000</text>
</svg>

使用 BrowserStack 模拟 iPhone 5 和第三代 iPad,我发现故障点介于 2200x2200 和 2400x2400 像素之间。5 兆像素的限制对应于 2289x2289 的图像,因此这与Duopixel 的评论一致,即渲染大小是最重要的。

于 2013-06-12T13:22:48.683 回答