☰

SVG 在 Chrome/Firefox 中无法完全显示

tag-icon • tag-icon firefox google-chrome svg
SVG 在 Chrome/Firefox 中无法完全显示

为什么此 SVG 图像在 Chrome 或 Firefox 中无法正常显示？它在 IE 9 中显示正常。我在 Firefox 5 和 6 以及 Chrome 13、14 和 15 中对此进行了测试 - 全部在 Windows 上。我回家后会测试 Linux 和 ChromeOS。

http://upload.wikimedia.org/wikipedia/commons/1/14/Map_of_Rhode_Island_highlighting_Bristol_County.svg

该图像看起来应该是这样的：

在此处输入图片描述

我只看到了红色县，没有其他内容。这可能与视口有关：

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     version="1.1"
     width="6416.0" height="9720.0"
     viewBox="-1856,-3363 6416,9720">...

需要注意的是，我得到这种行为全部维基百科上的县地图 SVG 图像，但不一定是维基百科上的其他 SVG 图像。

答案1

不确定发生了什么变化，但 Chromium 14 和 Opera 11.50 同意当前的 Firefox 渲染（巨型画布，仅显示红色国家），所以我猜测新的行为在标记的情况下是“正确的”。

编辑：好的，我已经将其追溯到夜间变更集范围在 Firefox 开发主干上。行为变化是由于那里的顶层变化，因为错误 547062，新行为似乎是正确的，符合预期。请参阅该错误的第一条评论——<clipPath>仅限于包含某些元素，并且<g>未包含在该列表中。因此测试用例具有无效标记。

机械蜗牛的链接验证器同意上述内容——它说：document type does not allow element "g" here。

答案2

正如 dholbert 所说，其他最近的网络浏览器也同意新的 Firefox 渲染。

这W3C 的标记验证器显示 svg 文件无效，这可能就是原因。

相关内容