Menu
I'm encountering an odd problem showing .svg using simple img tags on Apache.
On my local computer, the images are visible. On my mt VPS, the images come across as broken links. When I right click on a broken image link and 'Open Image', it shows the images correctly (telling me that the path is correct).
My HTML looks like this:
<img width="32" height="32" alt="icon" id="create-wheel-icon2" src="public/assets/img/svg/idea_vect.svg" style="left: 230px; top: 57px; opacity: 1;">
Any thoughts?
571
If you are trying to use SVG like <img src="image. svg"> or as a CSS background-image , and the file is linked to correctly and everything seems right, but the browser isn't displaying it, it might be because your server is serving it with an incorrect content-type.
One the major benefits of SVG is that they are resolution independent. This means that unlike file types such as JPG or PNG, SVGs retain the same quality no matter what screen resolution or size they are being at.
If an SVG image has been imported into the document, and then scaled up, it appears perfectly fine on-screen, and when exported as a PDF. When it's printed, it appears blurred and pixelated. It looks like the bottom image has been rasterized at 30 x 30 pixels.
By converting an SVG image or icon to an Office shape you can disassemble the SVG file and edit individual pieces of it. Converting the file is quite easy; just right-click the SVG image in your document, workbook, or presentation and select Convert to shape from the context menu that appears.
The info in link that Robert provided above worked for me:
.htaccess file with these rules:
AddType image/svg+xml svg svgz
AddEncoding gzip svgz
Most likely you aren't serving the images with the correct mime type. There's some information on how to do that here: http://kaioa.com/node/45
You could always try to get a png file to work first to make sure it isn't something obvious about where you are putting the images.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
