Exporting to SVG sometimes deletes the id

4 replies
66 views
Translate

We are exporting our ai files to svg files. After that we are using the id inside the svg elements to create interfaces for java classes. So we are strongly dependent on it.
Since Adobe Illustrator 28.4. the export is broken.

example from Ai 28.0.0, all 4 elements have a id.

<!-- Generator: Adobe Illustrator 28.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
	<g id="V:F:TransferDrumGuard_1_" filter="url(#dropShadow)">
		<path fill="#FF0000" d="M105,131.867c-1.104,0-2-0.896-2-2v-12c0-1.104,0.896-2,2-2s2,0.896,2,2v12
			C107,130.971,106.104,131.867,105,131.867z"/>
	</g>
	<path id="V:F:Formatklaue" fill="#FF0000" filter="url(#dropShadow)" d="M110,163h2v1h-2V163z M102,160l6,4h1v-2h4v2h13v-4H102z"/>
	<path id="V:F:KlemmungZahnsegment" fill="#FF0000" filter="url(#dropShadow)" d="M85.398,172.934L78,175.978L82.947,188
		l7.398-3.044L85.398,172.934z M83.672,177.634c-0.828,0-1.5-0.672-1.5-1.5s0.672-1.5,1.5-1.5s1.5,0.672,1.5,1.5
		S84.5,177.634,83.672,177.634z"/>
	<g id="V:F:Sperrklinke_1_" filter="url(#dropShadow)">
		<path fill="#FF0000" d="M78,221.5H63c-0.829,0-1.5-0.672-1.5-1.5s0.671-1.5,1.5-1.5h13.5v-3.667c0-0.828,0.672-1.5,1.5-1.5
			s1.5,0.672,1.5,1.5V220C79.5,220.828,78.828,221.5,78,221.5z"/>
	</g>

example from AI 30.8.1, some id’s are missing:

<!-- Generator: Adobe Illustrator 30.8.1, SVG Export Plug-In . SVG Version: 2.1.4 Build 1)  -->
    <g id="V:F:TransferDrumGuard" filter="url(#dropShadow3)">
      <path d="M105,131.867c-1.104,0-2-.896-2-2v-12c0-1.104.896-2,2-2s2,.896,2,2v12c0,1.104-.896,2-2,2Z" fill="red"/>
    </g>
    <path d="M110,163h2v1h-2v-1ZM102,160l6,4h1v-2h4v2h13v-4h-24Z" fill="red" filter="url(#dropShadow4)"/>
    <path d="M85.398,172.934l-7.398,3.044,4.947,12.022,7.398-3.044-4.947-12.022ZM83.672,177.634c-.828,0-1.5-.672-1.5-1.5s.672-1.5,1.5-1.5,1.5.672,1.5,1.5-.672,1.5-1.5,1.5Z" fill="red" filter="url(#dropShadow5)"/>
    <g id="V:F:Sperrklinke" filter="url(#dropShadow6)">
      <path d="M78,221.5h-15c-.829,0-1.5-.672-1.5-1.5s.671-1.5,1.5-1.5h13.5v-3.667c0-.828.672-1.5,1.5-1.5s1.5.672,1.5,1.5v5.167c0,.828-.672,1.5-1.5,1.5Z" fill="red"/>
    </g>

The element type for the elements where it is working are paths, the element type where it isnt working are compound paths.

I have seen several forum post with similar problems, but i havent found a suitable solution. Currently the AI-version is frozen in our design department, but this situation is untenable, especially because these bugs are there for than 2 years.

Abhishek Rao

Community Manager

Hi @brilliant_introvert798e,

Thanks for reporting this and for providing the detailed examples and sorry to hear that you experience this.

I tried reproducing the behavior in the latest Illustrator 30.8.1, but I wasn't able to reproduce the issue, the IDs were retained in my SVG export.

Could you please share a sample AI file along with its corresponding exported SVG file where the IDs are missing? This will allow me to test with your exact files and investigate further.

You can share the files through any cloud-sharing service. If they contain confidential information, please send the link to me via DM instead.

Thanks!
Abhishek

Translate

B

brilliant_introvert798eAuthor

Participant

Hi Abhishek,

i have done a lot of investigation to this problem and i think it is related to the UI of saving svg and the option inludeUnusedStyles.

Steps I done to triy to reproduce:
1) Open ai File
2) Choose SaveAs … SVG

Check Code with SVG-Code Button:

Result looks kind of ok, but compare green comment to my older post.

4)Change CSS Settings in this UI

Pressing “SVG Code”

Change Css Settings back:

Different SVG Export version changed from 9.03 to 2.1.4
Complete different layout of svg , contains now a defs section

path element has no id

Open another ai-file and select save as.. svg:

Svg settings has complete changed

Changing back to the settings I want:

Again , diffent svg layout, svg export 2.1.4

Expected SVG:

Generated:

After all that testing I have writen a jsx Script that is doing the export, with this Options:

// SVG export options (match the SVG Options dialog)
function makeSvgOptions() {
    var opts = new ExportOptionsSVG();
    opts.DTD                   = SVGDTDVersion.SVG1_1;                        // SVG-Profil: SVG 1.1
    opts.fontType              = SVGFontType.SVGFONT;                         // Text: SVG
    opts.fontSubsetting        = SVGFontSubsetting.None;                      // Subsetting: Ohne
    opts.embedRasterImages     = true;                                       // Bildposition: Einbetten
    opts.preserveEditability   = false;                                      // Illustrator-Bearbeitungsfunktionen: aus
    opts.cssProperties         = SVGCSSPropertyLocation.PRESENTATIONATTRIBUTES; // CSS: Präsentationsattribute
    opts.includeUnusedStyles   = true;                                      // Unbenutzte Grafikstile einschließen: aus
    opts.coordinatePrecision   = 3;                                          // Dezimalstellen: 3
    opts.documentEncoding      = SVGDocumentEncoding.UTF8;                    // Kodierung: Unicode (UTF-8)
    opts.SVGAutoKerning        = true;                                       // Weniger <tspan>-Elemente ausgeben: an
    opts.SVGTextOnPath         = false;                                      // <textPath> für Pfadtext verwenden: aus
    opts.slices                = false;                                      // Slicing-Daten einbeziehen: aus
    opts.includeFileInfo       = false;                                      // XMP einschließen: aus
    opts.compressed            = false;                                      // true => .svgz
    opts.saveMultipleArtboards = USE_ARTBOARDS;                              // "Zeichenflächen verwenden"
    if (USE_ARTBOARDS && ARTBOARD_RANGE !== "") opts.artboardRange = ARTBOARD_RANGE;
    return opts;
}