2

Why, when I open my .svg file alone in the browser it does show the picture from xlink:href but inside my website project it does not show the picture from xlink:href?

This is the image from xlink:href --> https://s10.postimg.org/ky5y39vvd/Untitled-19.png

Inside my website project I use either img tag or background-image to link to my .svg file...

The point is I want .svg file to work inside my website project :)

This is my SVG file:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" baseProfile="full">
    <title>Text Pattern Fill Example</title>
    <defs>
        <pattern id="img1" patternUnits="userSpaceOnUse" width="120" height="140">
            <image xlink:href="https://s10.postimg.org/e2h45vefd/alex-iby.jpg" x="0" y="0" width="120" height="300"
             transform="translate(135.780723, 50.780723) rotate(90.000000) translate(-55.780723, -60.780723)"
             /><!-- Image from http://silviahartmann.com/background-tile/6-grass-meadow-tile.php-->
        </pattern>
    </defs>

        <path d="M59.2078786,111.129597 C101.335439,132.142715 115.952158,85.5158857 115.952158,53.9197716 C115.952158,22.3236576 102.07475,5.17108475 70.7357496,5.17108475 C39.3967496,5.17108475 13.4042112,19.8971044 -0.939389391,40.9853457 C-15.28299,62.0735871 17.0803178,90.1164792 59.2078786,111.129597 Z"  transform="translate(55.780723, 60.780723) rotate(-90.000000) translate(-55.780723, -60.780723) " fill="url(#img1)"></path>        
</svg>

bumped to the homepage by Community 2 days ago

This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.

  • Did you find a solution to this issue? – Prabin Deka Sep 27 at 4:04
0
<embed src="image.svg">

SVG with xlink:href can't show local image inside website. But <embed src=""> or <object data=""></object> html tags works well on this situation.

If you want to use <img src="" /> tag you should place external image in your svg file as base64 string format.

  • 1
    Hi Khainarbyek, welcome to GDSE! I can't really tell if this is an valid answer. Could you edit it to include more information as to how this embed should work and what you mean by "click action is not working"? Thanks! – PieBie Oct 9 at 7:12

protected by Billy Kerr 2 days ago

Thank you for your interest in this question. Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).

Would you like to answer one of these unanswered questions instead?

Not the answer you're looking for? Browse other questions tagged or ask your own question.