user661987
user661987

Reputation: 221

Chrome not showing a SVG file

I have a SVG ilustration embeded in an HTML5 file which works in all modern browsers when I try it on local, but when I try to serve them from the web I dont get Chrome to render the SVG image, it only renders the SVG source code. I already added this lines to an .htaccess file which solved the issues in Safari and Firefox:

AddType image/svg+xml svg
AddType image/svg+xml svgz
AddEncoding x-gzip .svgz

But Chrome now is the only browser that doesn't render the image when comes from the web. My local file works fine even in Chrome.

What am I missing?

Here is the link to the sample of the issue, try it on Safari and Firefox, it will work. But in Chrome the story is different.

EDIT: Link was broken and seems to be missing www. prefix: http://www.getformgallery.com/demo/gos-form.html

Upvotes: 22

Views: 38408

Answers (6)

Scrooge McDuck
Scrooge McDuck

Reputation: 294

If you run lighttpd, you may have to add the svg mime type to configuration file:

mimetype.assign             = (
  ".svg"          =>      "image/svg+xml"
)

and set the style directly into the <img> tag (i.e. <img style="width:100%" src="picture.svg">).

Upvotes: 0

Niraj Shakya
Niraj Shakya

Reputation: 145

I have the same problem. Before some Chrome updates the svg I used in my site works but from certain Chrome updates those svg didn't worked and the page won't load either, just loads for 1-2s and then redirected to Aw, snap.

Finally I figure it out. You have to define "width" and "height" in Object tag eg.

<object height="100%" width="100%"data="images/image.svg" type="image/svg+xml"></object>

Upvotes: 12

rjtkoh
rjtkoh

Reputation: 201

Did you export the SVG from Photoshop using an extension like SVG Hero? If so, did you export a smart object? I had the same problem, but fixed it by saving the SVG from Illustrator instead. Now my SVG works in all browsers.

Upvotes: 1

vicky
vicky

Reputation: 99

SVG files are supported in chrome but are not supported fully. You might have some issue sometimes. Try this link to get help to your answer.

http://upload.wikimedia.org/wikipedia/commons/f/f6/Western_Australia_Local_Government_Areas.svg

Upvotes: -1

user3209468
user3209468

Reputation: 11

Chrome, Firefox, Opera, Safari and all other modern browsers (with the exception of IE) support SVG natively without the need for plugins. so you get plugin First and try do access

Upvotes: -2

Jarvix
Jarvix

Reputation: 86

I am using Google Chrome 18 and the sample-page renders fine for me, even after going to the SVG image directly. The problem might be solved by the browser-makers.

Upvotes: 0

Related Questions