Embed external image
The image
tag can be used to embed images. It supports the emebedding of other SVG files and PNG and JPEG images.
Certain features do not work when using the img
tag to display an SVG file, specifically the embedding of other images in the SVG file using the image
tag that we'll see later. Using object
solves this problem.
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<rect width="100%" height="100%" fill="none" stroke="black" stroke-size="1" />
<image x="10" y="10" width="100" height="100" href="rectangle.svg" />
<image x="10" y="100" width="50" height="50" href="circle.svg" />
</svg>