Copy link to clipboard
Copied
I'm using PS to create a floor map with offices and cubes. I create layers for each cube/office location on the map. I then do an Export As SVG to create the SVG file. However, I have come across a problem if there are too many layers. The layers only consist of 2 pixels in opposing corners to outline the cube defintions. The layers are all identical sizes so the SVG contains mostly G & USE elements. So its not a complexity issue. It seems to be an of layers issue. I can do an Export As to a PNG/GIF/JPG with all the layers. But the same PSD to SVG comes back with the error: "An unknown error occurred." I have tried this on a Windows 10 and Mac OS, all with the latest versions, with the same results.
I'm aware that PS may not be the best tool, but that is what I'm using as it produces the best SVG code(when it works) that I can parse on my website.
Any help would be appreciated.
Copy link to clipboard
Copied
Converting raster images to SVG rarely produces a usable product. IMO, Photoshop is the wrong tool for this. You should use Illustrator to create your vector graphics and then export to SVG.
Illustrator > Export to SVG options
Copy link to clipboard
Copied
Thanks Nancy. I tried Illustrator but it does not produce the same type of output that the PS does. At least that I could figure out. A sample is below. Also, it does not solve the original problem/question. If it is a limitation of PS that it can't handle more than X # of layers, then fine. But to get an Unknown Error message means there is a bug in PS that should be reported. If there is a way in Illustrator to create the same type of output as below, please point me to where I can get more info. If I should be creating the layers in PS differently to avoid the error, that would be helpful to know as well.
Thanks
<svg id="AMB1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="2998" height="4633" viewBox="0 0 2998 4633">
<defs>
<image id="image" width="79" height="99" xlink:href="data:img/png;base64,....
<image id="image-2" width="79" height="99" xlink:href="data:img/png;base64,....
....
</defs>
<g id="Cubes">
<g id="_118" data-name="118">
<use id="_118_00" data-name="118_00" x="1586" y="1085" xlink:href="#image-3"/>
<use id="_118_01" data-name="118_01" x="1590" y="1085" xlink:href="#image-4"/>
<use id="_118_02" data-name="118_02" x="1670" y="1085" xlink:href="#image"/>
<use id="_118_03" data-name="118_03" x="1750" y="1085" xlink:href="#image"/>
<use id="_118_04" data-name="118_04" x="1830" y="1085" xlink:href="#image"/>
<use id="_118_05" data-name="118_05" x="1910" y="1085" xlink:href="#image"/>
<use id="_118_06" data-name="118_06" x="1990" y="1085" xlink:href="#image-5"/>
<use id="_118_07" data-name="118_07" x="1590" y="1185" xlink:href="#image-6"/>
<use id="_118_08" data-name="118_08" x="1670" y="1185" xlink:href="#image-2"/>
<use id="_118_09" data-name="118_09" x="1750" y="1185" xlink:href="#image-2"/>
<use id="_118_10" data-name="118_10" x="1830" y="1185" xlink:href="#image-2"/>
<use id="_118_11" data-name="118_11" x="1910" y="1185" xlink:href="#image-2"/>
<use id="_118_12" data-name="118_12" x="1990" y="1185" xlink:href="#image-7"/>
</g>
Copy link to clipboard
Copied
Are you Aware that Photoshop does not support Vector files. If you export svg files form Photoshop. Photoshop may be able to create vector files for Shape and Text layers they are vector layers in Photoshop. However, Photoshop is a Pixels editor so most of the content of that a svg file Photoshop creates will be raster image information. If you use Photoshop menu File>Open and select a .svg files you will see Photoshop switch to import files where you can import the vector file as a single raster layer. in a new Photoshop document.
Copy link to clipboard
Copied
Thanks for the reply. I'm aware of the Photoshop limitations. Maybe there is a better solution. I just came across an old post of yours referring to a script that outputs the layer bounds info. That is what I really need. I have an image in PS that is a floormap. I'm creating a layer for each office/cube. If I can get that info in a text file where it can output the group name, layer name, x, y, w, h cooridinates, that would be ideal.
Copy link to clipboard
Copied
A script can retrieve quite a bit of information about layer like name id bounds, Here a script that will show some information about artlayers no group information. will be displayed. You could modify it to write a file not put out a message. Do not run it on a document with lots of lots of layer to test your display can handle round 20 layers
// 2019, use it at your own risk;
//Action Manager layerKind seems to be like this.
var Doclayerkind = [
"Pixel",
"Adjustment",
"Text",
"Shape",
"Smartobject",
"6",
"Layerset",
"3Dlayer",
"Gradientfill",
"Patternfill",
"Colorfill",
"12",
"13",
"14",
"15",
"16",
"17",
"18",
"19",
"20",
"21",
"22",
"23",
"24"
]
var theLayers = collectLayers ();
alert("Number of Layers " + theLayers.length + "\n\n" + theLayers.join("\n\n") );
////// collect layers //////
function collectLayers () {
// the file;
var myDocument = app.activeDocument;
// get number of layers;
var ref = new ActionReference();
ref.putEnumerated( charIDToTypeID("Dcmn"), charIDToTypeID("Ordn"), charIDToTypeID("Trgt") );
var applicationDesc = executeActionGet(ref);
var theNumber = applicationDesc.getInteger(stringIDToTypeID("numberOfLayers"));
// process the layers;
var theLayers = new Array;
for (var m = 0; m <= theNumber; m++) {
try {
var ref = new ActionReference();
ref.putIndex( charIDToTypeID( "Lyr " ), m);
var layerDesc = executeActionGet(ref);
//alert(actionDescriptor(layerDesc));
//if (m==1) alert(actionDescriptor(layerDesc));
var layerSet = typeIDToStringID(layerDesc.getEnumerationValue(stringIDToTypeID("layerSection")));
var isBackground = layerDesc.getBoolean(stringIDToTypeID("background"));
// if group collect values;
if (layerSet != "layerSectionEnd" && layerSet != "layerSectionStart" ) {
//if (layerSet != "layerSectionEnd" && layerSet != "layerSectionStart" && isBackground != true) {
var theName = layerDesc.getString(stringIDToTypeID('name'));
var theKind = layerDesc.getInteger(stringIDToTypeID('layerKind'));
var theID = layerDesc.getInteger(stringIDToTypeID('layerID'));
var theBounds = layerDesc.getObjectValue(stringIDToTypeID("bounds"));
var theseBounds = [theBounds.getUnitDoubleValue(stringIDToTypeID("left")), theBounds.getUnitDoubleValue(stringIDToTypeID("top")), theBounds.getUnitDoubleValue(stringIDToTypeID("right")), theBounds.getUnitDoubleValue(stringIDToTypeID("bottom"))];
layer = get_layer_by_id(theID);
var theBlend = layer.blendMode;
var theOpacity = layer.opacity;
var theVisible = layer.visible;
var theType = layer.typename;
var theParent = layer.parent;
if (layer!=null) {theRealkind = layer.kind;}
else {theRealkind = "";}
if (theRealkind==undefined) {theRealkind = "LayerKind.UNDEFINED"}
// Action Manager layerKnd Shape
//alert(Doclayerkind[theKind-1]);
if (Doclayerkind[theKind-1]=="Shape") {
//alert(actionDescriptor(layerDesc));
var theFill= layerDesc.getBoolean(stringIDToTypeID("fillEnabled"));
var theStrokewidth="";
var theStrokenabled=false;
try {
var theStrokewidth = layerDesc.getObjectValue(stringIDToTypeID("AGMStrokeStyleInfo")).getUnitDoubleValue(stringIDToTypeID("strokeStyleLineWidth"));
var theStrokenabled = layerDesc.getObjectValue(stringIDToTypeID("AGMStrokeStyleInfo")).getBoolean(stringIDToTypeID("strokeEnabled"));
}
//catch(e) {alert(e + ': on line ' + e.line, 'Script Error', true); }
catch(e) { }
theLayers.push([theName, "ID " + theID, Doclayerkind[theKind-1], theType, theParent, theBlend, "Opacity " + theOpacity, "Visible " + theVisible, "Bounds " + theseBounds, "stroke " + theStrokewidth + " " + theStrokenabled, "fill " + theFill, theRealkind]);
}
// Action Manager layerKind Adjustments
else if (Doclayerkind[theKind-1]=="Adjustment") {
//alert(actionDescriptor(layerDesc));
theLayers.push([theName, "ID " + theID, Doclayerkind[theKind-1], theType, theParent, theBlend, "Opacity " + theOpacity, "Visible " + theVisible, "Bounds " + theseBounds, theRealkind]);
}
// Action Manager layerKind Smartobjects
else if (Doclayerkind[theKind-1]=="Smartobject") {
//alert(actionDescriptor(layerDesc));
// get Smart Object info
//alert(obj_to_str(layer));
/*
alert(["allLocke " + layer.allLocked,
"\nblendMode " + layer.blendMode,
"\nbound " + layer.bounds,
"\nboundsNoEffect " + layer.boundsNoEffects,
"\nid " + layer.id,
"\nitemIndex " + layer.itemIndex,
"\nlinkedLayer " + layer.linkedLayers,
"\nname " + layer.name,
"\nopacity " + layer.opacity,
"\nparent " + layer.parent,
"\ntypename " + layer.typename,
"\nvisible " + layer.visible,
"\nxmpMetadata " + layer.xmpMetadata]);
*/
theLayers.push([theName, "ID " + theID, Doclayerkind[theKind-1], theType, theParent, theBlend, "Opacity " + theOpacity, "Visible " + theVisible, "Bounds " + theseBounds, theRealkind]);
}
// Action Manager layerKind Text
else if (Doclayerkind[theKind-1]=="Text") {
//alert(actionDescriptor(layerDesc));
// get text info
//alert(obj_to_str(layer));
/*
alert(["allLocke " + layer.allLocked,
"\nblendMode " + layer.blendMode,
"\nbound " + layer.bounds,
"\nboundsNoEffect " + layer.boundsNoEffects,
"\nid " + layer.id,
"\nitemIndex " + layer.itemIndex,
"\nlinkedLayer " + layer.linkedLayers,
"\nname " + layer.name,
"\nopacity " + layer.opacity,
"\nparent " + layer.parent,
"\ntypename " + layer.typename,
"\nvisible " + layer.visible,
"\nxmpMetadata " + layer.xmpMetadata,
"\nkind " + layer.kind,
"\ncolor " + layer.textItem.color,
"\ntextkind " + layer.textItem.kind,
"\nfont " + layer.textItem.font,
"\nblend " + layer.blendMode,
"\nantiAliasMethod " + layer.textItem.antiAliasMethod,
"\nsize " + layer.textItem.size,
"\nposition " + layer.textItem.position,
"\ncontents " + layer.textItem.contents,
]);
*/
theLayers.push([theName, "ID " + theID, Doclayerkind[theKind-1], theType, theParent, theBlend, "Opacity " + theOpacity, "Visible " + theVisible, "Bounds " + theseBounds, layer.textItem.font, layer.textItem.size, theRealkind ]);
}
// Action Manager layerKind Pixel
// Action Manager layerKind Layerset
// Action Manager layerKind Gradientfill
// Action Manager layerKind Patternfill
// Action Manager layerKind Colorfill
// Action Manager layerKind other
else {
//alert(theName + "," + Doclayerkind[theKind-1]);
//alert(actionDescriptor(layerDesc));
theLayers.push([theName, "ID " + theID, Doclayerkind[theKind-1], theType, theParent, theBlend, "Opacity " + theOpacity, "Visible " + theVisible, "Bounds " + theseBounds, theRealkind]);
}
};
}
catch (e) {};
};
return theLayers
};
// DOM Layer items
function layerInfo(layer) {
alert("LayerName='" + layer.name + "'"
+ "\nLayerID='" + layer.id + "'"
+ "\nLayerKind='" + layer.kind + "'"
+ "\nallLocked='" + layer.allLocked + "'"
+ "\nblendMode='" + layer.blendMode + "'"
+ "\nbounds='" + layer.bounds + "'"
+ "\nboundsNoEffects='" + layer.boundsNoEffects + "'"
+ "\nitemIndex='" + layer.itemIndex + "'"
+ "\nlinkedLayers='" + layer.linkedLayers + "'"
+ "\nopacity='" + layer.opacity + "'"
+ "\nparent='" + layer.parent + "'"
+ "\ntypename='" + layer.typename + "'"
+ "\nvisible='" + layer.visible + "'"
+ "\nxmpMetadata='" + layer.xmpMetadata + "'"
);
}
// Thanks to SuperMerlin
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function actionDescriptor(desc){
if(desc.typename == 'ActionDescriptor'){
var c = desc.count;
var msg= "Action Descriptor Item Count = " + c;
for(var i=0;i<c;i++){ //enumerate descriptor's keys
//$.writeln('AD '+zeroPad( i+1, 2 )+' = '+IDTz(desc.getKey(i)) +' : '+desc.getType(desc.getKey(i)));
msg = msg + "\n" + 'AD '+zeroPad( i+1, 2 )+' = '+IDTz(desc.getKey(i)) +' : '+desc.getType(desc.getKey(i)) ;
}
return msg;
}
function IDTz(id){
try {
var res = typeIDToStringID( id );
if(res == '' ){
var res = typeIDToCharID( id );
}
}
catch(e){}
return res;
}
function zTID( s ){
if( s.length == 4 ) var res = charIDToTypeID( s );
if( s.length > 4 ) var res = stringIDToTypeID( s );
return res;
}
function zeroPad(num,pad) {
var z = Math.pow(10,Number(pad))
return num <= z ? ((Number( num) + z).toString().substr(1)): num
}
};
//Thanks to r-bin
function obj_to_str(obj){var str = ""; for (var p in obj) if(obj.hasOwnProperty(p))try{str+=p+"::"+obj[p]+"\n";}catch(e){};return str;}
// Thanks to
function get_layer_by_id(id, doc_id) {
try {
var doc;
if (doc_id == undefined) doc = activeDocument;
else {
for (var i = 0; i < documents.length; i++) {
if (documents[i].id == doc_id) {
doc = documents[i];
break;
}
}
}
if (doc == undefined) { alert("Bad document " + doc_id); return null; }
var r = new ActionReference();
r.putProperty(charIDToTypeID("Prpr"), stringIDToTypeID("json"));
if (doc_id == undefined) r.putEnumerated(charIDToTypeID("Dcmn"), charIDToTypeID("Ordn"), charIDToTypeID("Trgt"));
else r.putIdentifier(charIDToTypeID("Dcmn"), doc_id);
eval("var json = " + executeActionGet(r).getString(stringIDToTypeID("json")));
if (json == undefined) return null;
var set = new Array();
function search_id(layers, id) {
for (var i = 0; i < layers.length; i++) {
if (layers[i].id == id) { set.push(i); return true; }
}
for (var i = 0; i < layers.length; i++) {
if (layers[i].layers) {
if (search_id(layers[i].layers, id)) { set.push(i); return true; }
}
}
}
if (search_id(json.layers, id)) {
var ret = doc.layers;
for (var i = set.length-1; i > 0; i--) { ret = ret[set[i]].layers;}
return ret[set[0]];
}
return null;
}
catch (e) { alert(e); }
}
Find more inspiration, events, and resources on the new Adobe Community
Explore Now