CODEWITHSUNDEEP
imagesvg
Marijn Kok
Marijn Kok

Reputation: 119

SVG Image element resize picture

So i'm busy with SVG and i need a couple of images in my project. So you have the element . You can also give the height and width. The given picture doesn't resize to the height and width you give to the image element.

I have this code:

<g class="node image" transform="translate(0,129.652067739873)" type="ad">
    <image href="content/image/image.png" height="30px" width="100px" y="41.94444444444444" x="0">
        <title>google.nl</title>
    </image>
    <text y="56.625" x="106" dy=".35em" text-anchor="start">google.nl</text>
</g>

Now i want that the image.png cover the whole image element. Like background-size:cover; But that doesn't work, and i can't find any attribute who can do this. Is there a way to do this in a correct way?

Upvotes: 1

Views: 181

Answers (1)

ahmohamed
ahmohamed

Reputation: 2970

Try setting preserveAspectRatio="none" for the <image> element. Also, if you want it to cover all of the svg, set width and height to '100%'

<image href="content/image/image.png" height="100%" width="100%" y="41.94444444444444" x="0" preserveAspectRatio="none">

Upvotes: 2

Related Questions