Firefox中的Inline SVG

我对这个有点难过。我使用Protovis（一个JS库）渲染SVG可视化文件，它在Chrome和Firefox中都能很好地工作。我将渲染的SVG保存在我的服务器上，并尝试使用PHP函数在“图库”视图中重新渲染它，并且在Firefox中失败。我所看到的只是SVG中的文本，而不是SVG。Firefox中的Inline SVG

我保存完整的SVG内容，就像这样：

<svg height="220" width="880" stroke-width="1.5" stroke="none" fill="none" font-family="sans-serif" font-size="10px"><g transform="translate(30, 10)"><line stroke-width="1"

我一直在使用<object>尝试，但一切确实是及时的Firefox下载一个插件，它无法找到。

它在FF4测试版中工作，但我不明白为什么即使在Firefox 3.6中也不行。这是我应该放弃的东西吗？再次

http://www.rioleo.org/protoviewer（点击 “库”）

感谢：你可以在这里看到演示！

来源

2010-12-12 Rio

你有没有试过header（“Content-type：image/svg + xml”）; – pastjean 2010-12-12 03:19:05

不会使页面不可见，但？ – Rio 2010-12-12 03:47:52

内嵌SVG只适用于Firefox在两种情况下：

Firefox有实验HTML5 parser启用（即，您每晚使用4.0）
正在解析的文档不是HTML，而是XHTML（Content-type: application/xhtml+xml）

的object办法由罗布建议应该工作，只要单独的SVG文件是从服务器来与Content-type: image/svg+xml和你使用正确的语法：

<object data="foo.svg" type="image/svg+xml" width="400" height="300">

见Damian Cugley's article 'SVG: object or embed?'对于一些其他的选择细节，或使用SVGWeb。

来源

2010-12-14 15:16:52 robertc

如果我将文件中的内容类型元标记更改为xhtml + xml，为什么它不起作用？ – Rio 2010-12-15 22:07:01

@Rio与元标记无关，重要的内容类型位于Web服务器发送的HTTP标头中。根据pastjean的评论，这通常可以从服务器端脚本语言进行控制。如果您没有使用服务器端脚本语言，请检查您的Web服务器配置，或尝试将文件扩展名更改为'.xhtml'。 – robertc 2010-12-16 00:39:36

确保您使用的对象要素正确的属性和结束标记：

<object data="yourimage.svg"></object>

来源

2010-12-12 05:09:20 Rob

好点，我做了更改，现在它看起来像Chrome和Firefox中的iFrame（如果您想查看，代码仍然存在于“图库”标签中），即最后一个框。 – Rio 2010-12-12 05:23:24

@Rio - 所以我没有得分？ – Rob 2010-12-12 14:12:07

好吧，它不起作用：D – Rio 2010-12-12 20:04:46

This example对您有用。加载时间和MIME文本/ html上的SVG渲染支持是ItsNat Java Web框架的一项支持功能，无论如何它的灵感来源于this JS code，后者可以在您的上下文（PHP）中对您有用。

来源

2011-01-07 08:30:46 jmarranz

Firefox中的Inline SVG

回答

相关问题