Import SVG fails to load images correctly when linked via a use tag with the source provided in the defs
The import SVG feature does not correctly load images when using a use tag that links to an image in the defs list.
The issues with the import are the following:
1. The image is incorrectly placed in the clipping group, despite one not being present in the svg.
2. Two strange clipping path triangles are incorrectly added to the clipping group that completely hides the images.
3. The art board is also incorrect and not placed around the design.
I created a small svg example that has an image that is linked twice within the design.
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" viewBox="0,0,100,100">
<defs>
<image xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAARUlEQVR42u3PQQ0AAAjEMM6/aMACT5IuM9B01f6/gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIBcGuAsY8/q7uoYAAAAAElFTkSuQmCC" id="image-1"/>
</defs>
<g>
<use x="0" y="0" width="50" height="50" xlink:href="#image-1"/>
<use x="50" y="50" width="50" height="50" xlink:href="#image-1"/>
</g>
</svg>
The SVG should show two red squares that are in a checkered pattern. I have attached a screenshot of the problem.
I am running the latest version of Illustrator, version 26.5. This issue affects previous versions of the software.
-
Blayze commented
Here is some additional information on the tag:
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use
https://svgwg.org/svg2-draft/struct.html#UseElement