问题
I'm a bit stumped with this one. I'm rendering SVG visualizations using Protovis, a JS library, and it works perfectly well in Chrome as well as Firefox. I save the rendered SVG on my server and try to re-render it in a "gallery" view using a PHP function, and this fails in Firefox. All I see is the text in the SVG, but not the SVG.
I save the full svg content, like so:
<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"
I've tried using <object> but all that does is prompt Firefox to download a plugin it can't find.
It works in FF4 beta, but I can't see why it won't work even in Firefox 3.6. Is this something I ought to give up on? You can see a demo here:
http://www.rioleo.org/protoviewer (click on "gallery")
Thanks once again!
回答1:
Inline SVG only works in Firefox in two situations:
- Firefox has the experimental HTML5 parser enabled (ie. you're using a 4.0 nightly)
- The document being parsed is not HTML but XHTML (
Content-type: application/xhtml+xml)
The object approach suggested by Rob should work, as long as the separate SVG file is coming from your server with Content-type: image/svg+xml and you use the correct syntax:
<object data="foo.svg" type="image/svg+xml" width="400" height="300">
See Damian Cugley's article 'SVG: object or embed?' for details of some other options, or use SVGWeb.
回答2:
Make sure you are using the correct attributes with the object element and the end tag:
<object data="yourimage.svg"></object>
回答3:
This example may be useful for you, explanation. SVG rendering support on load time and MIME text/html is a supported feature of ItsNat Java web framework, anyway it was inspired on this JS code, the latter can be useful for you in your context (PHP).
来源：https://stackoverflow.com/questions/4420234/inline-svg-in-firefox