Repository: flutter
Issue: [flutter_svg] SVG with nested <svg> elements isn't rendering
Labels: package,p: flutter_svg

_Imported from https://github.com/dnfield/flutter_svg/issues/132_

Original report by @bbedward on Mar 7, 2019

Hi,

I have an SVG that is only partially rendering - I'm not sure why. In this case, only the feet of the monkey in the image are rendering with flutter_svg 0.12.0

Problematic SVG:
https://www.dropbox.com/s/f5krj9osezwp0sg/test.svg?dl=0

Thanks for the help!

---
Comment by @dnfield on Mar 7, 2019
Can you just paste the content of the SVG here directly?  I can't seem to access that link properly.

---
Comment by @bbedward on Mar 7, 2019
Oh sorry, it's quite large so better to not paste it I think.

Try this one:
https://cdn.discordapp.com/attachments/490551255727603733/553284336527605770/test.svg

---
Comment by @dnfield on Mar 7, 2019
Your SVG has multiple nested SVG elements.  that's not supported at this time.

You could probably get away with just changing all the nested `<svg>` tags to `<g>`s. None of them are actually changing the viewBox.

---
Comment by @dnfield on Mar 7, 2019
Ah, no you can't just do a new <g>, but unfortunately this kind of SVG isn't supported.  I haven't seen a lot of demand for it, but if you want to create a PR to make it work I'd review it.

---
Comment by @bbedward on Mar 10, 2019
Thanks for the response, I was able to change the format of the SVGs as you suggested and they work without nested <svg> elements now.

---
Comment by @dnfield on Mar 10, 2019
I'll keep this open to track nested `<svg>` elements.  Right now it's lower priority for me because I'm not sure how many people really want it compared to, say, filter effects.  But If it gets enough upvotes here I'll rethink that :)

---
Comment by @ikbendewilliam on Aug 25, 2022
@bbedward I've added your svg to the example project and as golden in https://github.com/dnfield/flutter_svg/pull/754 if this is an issue please let me know and I'll search for another test image 😁 

---
Comment by @0xmove on Jun 30, 2023
@ikbendewilliam This SVG `ipfs://bafkreidj2yju4jmrzxw4dkzcsxgyfhzwywumxwoqntcpkabjli4njy6lky` still doesn't display properly.

---
Comment by @ikbendewilliam on Jun 30, 2023
@0xmove My PR didn't merge as @dnfield moved away from the implementation in favour of the new (and better) [vector_graphics](https://github.com/dnfield/vector_graphics) package, which is now used behind the scenes AFAIK.

---
Comment by @phamconganh on Jun 15, 2024
@ikbendewilliam i tried you PR to [vector_graphics](https://github.com/dnfield/vector_graphics) with some small fixes, it shows the nested svgs but in the wrong position (child svg not in the right position)
![Screen Shot 2024-06-15 at 15 02 15](https://github.com/dnfield/flutter_svg/assets/28704713/7ea2d395-ae9e-4034-867d-ee3e4f61380c)
original svg
![Screen Shot 2024-06-15 at 15 02 38](https://github.com/dnfield/flutter_svg/assets/28704713/20071343-2e3a-4202-9041-a7c5de7e4296)
```
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <rect x="10" y="10" width="50" height="50" fill="blue" />
  <svg x="70" y="70" width="50" height="50">
    <circle cx="25" cy="25" r="20" fill="red" />
  </svg>
</svg>
```