melvindidit
melvindidit

Reputation: 440

SVGs not rendering on IE8+

I'm using SVG spritemaps for my SVG images, included in a single file and make use of the tag.

For Ex, my .svg file contains

<symbol id="file">
 <path>....
</symbol>

and I use the svg on the html as

<svg>
<use xlink:href="pathtosvg/main.svg#file"></use>
</svg>

is there any workaround or do I have to create individual svg images for all the svgs? TIA

Upvotes: 0

Views: 151

Answers (1)

Spudley
Spudley

Reputation: 168803

IE8 does not support SVG at all.

IE9 does support it, but is missing some important features, including external elements.

You can see more info about the supported features here: http://caniuse.com/#search=svg

IE8 and earlier do support an alternative vector format called VML which is proprietary to IE. This was deprecated in favour of SVG in IE9, but there are a number of JavaScript libraries available that are designed to convert SVG into VML in order to allow backward compatibility for SVG in older IE versions. These libraries can allow some SVG images to be successfully displayed even in very old IE versions.

You might want to try out some of these libraries. You can find a list of them (and other polyfill libs) here: https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills#svg.

However I suspect that you're always going to struggle, because even with these polyfills, many SVG features will remain unsupported.

The bottom line is that if you really have to support old IE versions, then you need to reconsider your use of modern browser features. IE8 in particular is a very old browser, and simply doesn't have the kind of feature set we expect in modern browsers. Either drop the features or drop the browser.

Upvotes: 1

Related Questions