SVG display bug in different browsers
On my server, I did a remote XSLT tranformation in php like this:
$command = $java . $saxon . $target2 . ' ' . $xsl2.' '.$param;
passthru($command, $result);
the $target2 is an input SVG file and $xsl2 is the stylesheet, saxon is the saxon8.jar file, and I开发者_开发百科've tested it with several broswers.
In Google Chrome, everything worked perfect, the SVG graph got shown correctly.
However, I tried to do the same thing in Firefox(which should supports SVG graph), no SVG graph got shown, but only the actual code for the SVG graph was shown. I used "viewsource" to check out the first and last few lines of the generated SVG in firefox, and it read:
<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<!-- Generator: Adobe Illustrator 13.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 14948) -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.0"
.......
</svg>
I tried using FireBug to debug, and there is html
tags and head
and body
tags shown, is is saying I am screwing up my SVG with HTML stuff?
I am kinda stuck here, thanks in advance for your guys' help!
The solution to this problem is to add a content type header file like:
header("Content-type: image/svg+xml");
add it to the front of the php file, and everything should work from there.
Kevin's answer works well in PHP, but it could be achieved without help of PHP already on server side before PHP interpreter kicks in.
Here as an example on Apache's httpd.conf
/ .htaccess
, taken from HTML5BoilerPlate's Apache HTTP server boilerplate.
# ------------------------------------------------------------------------------
# | Proper MIME types for all files |
# ------------------------------------------------------------------------------
# Extension may be specified w or w/o leading dot
# http://httpd.apache.org/docs/current/mod/directive-dict.html#Syntax
<IfModule mod_mime.c>
# SVG
# Required for svg webfonts on iPad
# twitter.com/FontSquirrel/status/14855840545
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
</IfModule>
精彩评论