Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

embedding SVG in SVG

I couldn't find the way how to embed two SVGs into SVG document. I need to do it with ability of code which would manipulate with both child SVG-s, and would like to have independent coordinates on both of those areas. I don't like to do it in HTML, because I consider it too limiting comparing to SVG. Many thanks!

like image 994
Alex Avatar asked Nov 06 '11 17:11

Alex


People also ask

Can you embed an SVG in an SVG?

The SVG format allows for the nesting of SVG graphics. It is possible for an “<svg>” elements, to be placed within another “<svg>” element.

How do I embed an image in SVG?

SVG images can be written directly into the HTML document using the <svg> </svg> tag. To do this, open the SVG image in VS code or your preferred IDE, copy the code, and paste it inside the <body> element in your HTML document. If you did everything correctly, your webpage should look exactly like the demo below.

Can you nest SVG elements?

You can use a nested SVG to group elements together and then position them inside the parent SVG. Now, you can also group elements together and position them using the <g> group—by wrapping elements inside a group <g> element, you can position them on the canvas by using the transform attribute.


1 Answers

An SVG document fragment consists of any number of SVG elements contained within an ‘svg’ element.

  • Source: http://www.w3.org/TR/SVG/struct.html#NewDocument

Basically:

<svg …>
  <svg id="a" …>…</svg>
  <svg id="b" …>…</svg>
</svg>
like image 93
Phrogz Avatar answered Sep 25 '22 15:09

Phrogz