shrpne / vue-inline-svg

Dynamically loads an SVG source and inline <svg> element so you can manipulate the style of it
MIT License
175 stars 21 forks source link

Set width and height of svg inside svg #36

Closed web-programmer-here closed 2 years ago

web-programmer-here commented 2 years ago

The svg I am trying to show has another svg inside it

<svg>
<defs ...></defs>
<g xmlns="http://www.w3.org/2000/svg">
   <svg xmlns="http://www.w3.org/2000/svg" ....></path></svg>  // how to add width and height to this?
</g>
</svg>

I cant seem to overwrite the width and height of this inner svg?

web-programmer-here commented 2 years ago

also tried this

const transform = (svg) => {
    svg.setAttributeNS(null, "width", "100px");
        svg.setAttributeNS(null, "height", "100px");
    return svg;
};

but it did not work

shrpne commented 2 years ago

also tried this but it did not work

You should use transformSource, but in your code you are setting width to the root svg, you should query inner svg first