Home / Questions / 24837
Accepted
Ventur
Asked: 2020-09-24 08:31:26 +0800 CST 2020-09-24 08:31:26 +0800 CST

SVG vectorized image not displaying in IE, Chrome

  • 772

I am trying to insert a vectorized image in SVG format, but I can only see it in mozilla firefox, for IE and chrome it does not appear. I have looked for some documentation on svg in browsers, in many I see examples where shapes are drawn by placing coordinates, colors and the browser renders in svg image, but at home I have that svg image in a file.

Code :

   <div class= "spacioLogos">
         <p:graphicImage value="./images/logo_mexico.svg" width="120" height="55" styleClass="logoizquierda"/>

         <p:graphicImage value="./images/logo_mexico.svg" width="120" height="55" styleClass="img"/>                    

    </div>

The same is seen if I place the html img:

<img src="./images/logo_mexico.svg" width="120" height="55" class="responsive" />

Sample of how it is rendered in browsers: mozila firefox: mozilla firefox

Google Chrome: Google Chrome

internet explorer edge: internet explorer edge

html

1 Answers

  1. Best Answer

    It's solved, I modified the web.xml of my application adding the type-mime of svg images, with this they are already shown in Mozilla firefox, IE, and Chrome.

        <mime-mapping>
        <extension>svg</extension>
        <mime-type>image/svg+xml</mime-type>
    </mime-mapping>
    <mime-mapping>
        <extension>svgz</extension>
        <mime-type>image/svg+xml</mime-type>
    </mime-mapping>
    • 3