Hi Monika, Martin, Francisco, Ruth, Alec and others,

I am answering to some of the comments below. In general, please open separate issues for individual issues you see in Adobe Illustrator. Even if they all are related to SVG.

@Monika The Adobe Illustrator 2019 release fixes the issue that you see with the linked SVG example. The one with the flag of the EU. There should no longer be warnings about maximum nesting levels and the layer tree should look much flatter than it used to. We also fixed a few issues with masks.

@Alec The Adobe Illustrator 2019 release has support for the fill-rule property of SVG. Your example should import correctly now. We still have some work to do with masks though we did fixes here as well. Gradient and pattern transforms should import in general though we will improve support even more in future releases.

@Rith and @Martin Adobe Illustrator does not draw strokes in the coordinate space of the object as defined by Postscript or SVG. This causes the difference between the stroke width that you see in Adobe Illustrator on import and other SVG viewers. We will continue to improve the import further in future releases.. In general, the rendering model differs which causes the visual differences at the moment.

@Francisco Adobe Illustrator does not support import of images in SVG of formats other than raster images. Neither for embedded images with dataURLs nor linked images.

Greetings,
Dirk

SVG support is terrible, we create SVGs in Affinity Designer & Sketch in our studio - both programs play nice with each other, and can open and edit SVGs created by the other. Illustrator on the other hand does not.

Illustrator does not support my SVG file that contains SVG Image elements.

eg:
<image id="Asset-1" xlink:href="asset-1.svg" ...></image>

or

<image id="Asset-1" xlink:href="data:image/svg+xml;base64,PD94bWwgd.......></image>

It just doesn't show the images that are .svg (works with png). Other SVG viewers don't have problems with this.

Hello Dirk,

regarding SVG I encountered the following issue in Adobe Illustrator: When defining a pen with a “stroke-width” in the “style” section of the SVG transformation are not applied to “stroke width”.

e.g.

Definition of Pen:
******************
<style type="text/css">
<![CDATA[
.Pen0 {fill:none;stroke:black;stroke-width:53;}
.ShapeStyle0 {fill:black;stroke:black;stroke-width:53;}
]]>
</style>

Transformation:
*****************
<g transform="matrix(3.12112 0 0 3.12884 165.161 945.581)">

Draw elements:
****************
<path d="M512.705,258.049 A184.000,241.500 0.000 1,0 512.724,740.951" fill-rule="nonzero" class="Pen0"/>
<polyline points="502,258 998,258" class="Pen0"/>

This issue does not occur in other SVG viewers or Web browsers. There the stroke-width is transformed / scaled correctly.

Don’t hesitate to contact me if you require test files to reproduce the issue.

regards
Martin

Hello Ruth,

Thanks a lot for your feedback Ruth! It would be great to hear more about the stroke-width issue that you run into. I tested this minimal example:

<svg xmlns="http://www.w3.org/2000/svg">
<rect x="10" y="10" width="100" height="100" style="stroke:black;fill:none;"/>
<rect x="120" y="10" width="100" height="100" style="stroke:black;fill:none;stroke-width:1"/>
<rect x="230" y="10" width="100" height="100" style="stroke:black;fill:none;stroke-width:1px"/>
<rect x="120" y="120" width="100" height="100" style="stroke:black;fill:none;stroke-width:10"/>
<rect x="230" y="120" width="100" height="100" style="stroke:black;fill:none;stroke-width:10px"/>
</svg>

but all stroke-width values compute correctly after opening in Adobe Illustrator. Could you please post a short example here? Or, for bigger files, it is also possible to use sharewithai@adobe.com

Thanks a lot in advance!

Greetings,
Dirk

Dirk

For me, the stroke-width issue has caused much wasted time. The svg file has a sequence of <g> elements, none nested, and no complex transforms, but nevertheless lines are imported massively over-wide. I know PostScript can do all these transforms and more; why is it so hard for Illustrator to support import.

Re Dirk: for me, the requirement is just that the graphic imports with properties correct and, if there are aspects of the import that cannot be imported properly I am informed in a useful way. Eg:

File X.svg has been imported with the following issues:
* Repolarising the crystals is not supported, line 203
* Transparency cannot be combined in groups, line 554
* Comments in the source have been ignored, first-line 2

Hi Monika. I can confirm the issues with nested <use>s. Illustrator (unnecessarily) creates too deeply nested groups. Eventually, it will reach the maximum allowed group nesting level and stops drawing. I logged that issue.

Illustrator does not use SVG as its native document format. Even though Illustrator does try to preserve certain attributes on SVG import it is not enough for a full SVG round tripping experience. Do you want to use Illustrator as "SVG editor" where structure, styling blocks and class names get preserved as much as possible, or is it enough to preserve attributes, styles and interactions on the element level? So CSS classes might get remixed as it makes sense for the exported SVG document.

What issues do you have with groups and masks?

Hi Alec, self referencing masks should not crash Illustrator in the latest release anymore. Nested masks, fill-rule are still an issue and I logged those. Could you share some failing examples with gradients, image transforms and patterns please? Please feel free to create separate user voice reports per SVG issue and file them as bugs. Thanks a lot!

Please import fill-rule="evenodd" properly. Test case of an "O" that imports incorrectly (as fill-rule="nonzero") without the hole in the middle. Illustrator gets this wrong, but XD imports it properly. Some additional issues:

1. Ref-ing the same mask crashes Illustrator.
2. Nested masks don't import properly.
3. Gradient and image transforms and patterns (fit/fill/tile) don't import

<svg width="90" height="90" viewBox="0 0 90 90" version="1.1" xmlns="http://www.w3.org/2000/svg&quot; xmlns:xlink="http://www.w3.org/1999/xlink">
<title>O</title>
<use xlink:href="#path1_fill" fill="#C4C4C4"/>
<defs>
<path id="path1_fill" fill-rule="evenodd" d="M 67.0157 46.007C 68.8447 34.502 61.8237 24 48.1947 24C 33.9167 24 25.0667 34.03 23.2967 44.945C 21.4677 56.45 28.1347 66.952 42.1767 66.952C 56.6317 66.952 65.3047 56.922 67.0157 46.007ZM 47.6047 32.201C 38.8727 32.201 33.3857 38.16 32.1467 45.712C 31.0847 52.497 34.2707 58.751 42.6487 58.751C 51.4397 58.751 56.9267 52.792 58.1067 45.24C 59.1687 38.455 55.9827 32.201 47.6047 32.201Z"/>
</defs>
</svg>