Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Creating Illustrator top layers in SVG

When I load my layered SVG files into Illustrator all the layers works just as they should but they are always positioned under a new layer; "Layer 1" that I did not specify.

How do I create a SVG where my top layers end up as the top layer in Illustrator as well?

like image 597
Carl Avatar asked Jul 19 '11 10:07

Carl


People also ask

How do you bring a layer to the top in Illustrator?

To move content from one layer to another, select the content you want to move in the Layers panel and drag the color box (called the Selection indicator) to the right of the layer name up or down to the new position.

Can SVG files have layers?

When you open an SVG file in Silhouette Studio, all the layers will be grouped together. If you select the file, it all moves as one piece. If you leave it that way, you will only be able to use one type of material to cut out the entire file.


2 Answers

  1. Create a file in Illustrator that has an organization like you want.
  2. Save the SVG from Illustrator as "a.svg".
  3. Re-open the SVG file in Illustrator.
    Hey, all my layers got regrouped under Layer 1!
  4. Fix the organization.
  5. Save the SVG from Illustrator with the "Preserve Illustrator Editing Capabilities" option checked as "b.svg".
  6. Re-open the SVG file in Illustrator.
    Yay, the Layers were preserved!
  7. Diff a.svg and b.svg to see what extra metadata Illustrator is saving.
  8. Mimic this data in your own file.
    Cry when you realize that the solution is an enormous proprietary blob (the <i:pgf> element).
  9. Give up and decide it doesn't really matter all that much.
like image 162
Phrogz Avatar answered Sep 29 '22 03:09

Phrogz


It indeed does really matter to me so I stopped crying, spent a few hours and scripted this solution:

  • Download the scripts: https://github.com/JcBernack/IllustratorScripts/archive/master.zip
  • Place the "Fix SVG Layers" folder in the standard Illustrator scripts folder. Where that is depends on your installation and language, mine is at:
    C:\Program Files\Adobe\Adobe Illustrator CS6 (64 Bit)\Presets\de_DE\Skripten
  • Start Illustrator and load the SVG where all the actual layers are now groups within a new "Layer 1".
  • Go to File->Scripts->Fix SVG Layers->FixSvgLayers
  • Yay! All the groups are now actual layers and "Layer 1" is gone for good.

A bit more information:

  • "FixSvgLayers" converts all groups within the "Layer 1" back to layers, moves them to the document root and deletes the now empty "Layer 1".
  • "GroupsToLayers" converts all groups within the currently active layer to layers, without moving or deleting anything.
  • Both scripts prompt for a "recursion depth" which specifies how many levels of groups-groups-groups should by converted to sub-sub-sub-layers.
  • The third script (ConvertGroupsIntoLayers) is just needed by the other two, calling it from the menu opens a prompt but doesn't do anything.

When opening the SVG all the actual layers are groups within a new "Layer 1". These can be converted back without ambiguity. Sub-layers are problematic though, because there is no information to distinguish actual groups from groups which should be sub-layers (if there is please let me know!). As a workaround my script prompts for a recursion depth and converts all groups to (sub-)layers within that depth.

In my case I had three layers, where one of them was just a container for more sub-layers. To get back the original layer-structure I executed FixSvgLayers with a depth of 0, then selected the container layer and executed "GroupsToLayers" with depth of 0.

If all three layers were "container"-layers executing FixSvgLayers with a depth of 1 would have been enough to get back the correct structure.

If you don't want any groups and every group should be converted to a (sub-)layer just enter a high enough number as the recursion depth.

like image 29
Gigo Avatar answered Sep 29 '22 03:09

Gigo