how to get vector mask image or vector data

[javaer]

I want to replicate the vector mask effect of a Photoshop layer on a web page and need to obtain the image of the vector mask.

how to get vector mask image or vector data

[D Fosse · Accepted solution]

Vector data need to be handled in Illustrator. Photoshop is not a vector editor, the vector tools in Photoshop are just aids to making masks and selections.

If you only need the base vector data in a web-friendly format:

• target the mask
• export paths to Illustrator
• export to SVG from Illustrator.

[c.pfaffenbichler · Accepted solution]

Alternatively it would be possible to get the Pathpoints and Bezier Handles as a text file via a Script. 

What exact kind of data do you actually need for further processing? 

[javaer]

Is there no similar image for vector mask that can be obtained similar to layer mask? If not, how can I get the path data through script, and convert this path data into svg

[c.pfaffenbichler]

This would create a txt-file on the desktop. 

Not sure how to change that to a svg-file. 

// 2025, use it at your own risk;
if (app.documents.length > 0) {
if (hasVectorMask() == true) {
var myDocument = activeDocument;
var thePath = collectPathInfoFromDesc2023(myDocument, myDocument.pathItems.length);
writePref(thePath.join("\n"), "~/Desktop/"+myDocument.name+".txt");
}
};
////// collect path info from actiondescriptor, indices start at 1, not 0 //////
function collectPathInfoFromDesc2023 (myDocument, thePath) {
var originalRulerUnits = app.preferences.rulerUnits;
app.preferences.rulerUnits = Units.POINTS;
// based of functions from xbytor’s stdlib;
var idPath = charIDToTypeID( "Path" );
var ref = new ActionReference();
// check if thePath is an index or a dom-path;
if (thePath.constructor == Number) {
ref.putIndex(idPath, thePath)
}
else {
thePath.select();
var ref = new ActionReference();
ref.putEnumerated( charIDToTypeID( "Path" ), charIDToTypeID("Ordn"), charIDToTypeID("Trgt") );
};
// get stuff;
var desc = app.executeActionGet(ref);
var pname = desc.getString(cTID('PthN'));
// create new array;
var theArray = new Array;
var pathComponents = desc.getObjectValue(cTID("PthC")).getList(sTID('pathComponents'));
// for subpathitems;
for (var m = 0; m < pathComponents.count; m++) {
	var listKey = pathComponents.getObjectValue(m).getList(sTID("subpathListKey"));
	var operation1 = pathComponents.getObjectValue(m).getEnumerationValue(sTID("shapeOperation"));
	switch (operation1) {
		case 1097098272:
		var operation = 1097098272 //cTID('Add ');
		break;
		case 1398961266:
		var operation = 1398961266 //cTID('Sbtr');
		break;
		case 1231975538:
		var operation = 1231975538 //cTID('Intr');
		break;
		default:
//		case 1102:
		var operation = sTID('xor') //ShapeOperation.SHAPEXOR;
		break;
		};
// for subpathitem’s count;
	for (var n = 0; n < listKey.count; n++) {
		theArray.push(new Array);
		var points = listKey.getObjectValue(n).getList(sTID('points'));
		try {var closed = listKey.getObjectValue(n).getBoolean(sTID("closedSubpath"))}
		catch (e) {var closed = false};
// for subpathitem’s segment’s number of points;
		for (var o = 0; o < points.count; o++) {
			var anchorObj = points.getObjectValue(o).getObjectValue(sTID("anchor"));
			var anchor = [anchorObj.getUnitDoubleValue(sTID('horizontal')), anchorObj.getUnitDoubleValue(sTID('vertical'))];
			var thisPoint = [anchor];
			try {
				var left = points.getObjectValue(o).getObjectValue(cTID("Fwd "));
				var leftDirection = [left.getUnitDoubleValue(sTID('horizontal')), left.getUnitDoubleValue(sTID('vertical'))];
				thisPoint.push(leftDirection)
				}
			catch (e) {
				thisPoint.push(anchor)
				};
			try {
				var right = points.getObjectValue(o).getObjectValue(cTID("Bwd "));
				var rightDirection = [right.getUnitDoubleValue(sTID('horizontal')), right.getUnitDoubleValue(sTID('vertical'))];
				thisPoint.push(rightDirection)
				}
			catch (e) {
				thisPoint.push(anchor)
				};
			try {
				var smoothOr = points.getObjectValue(o).getBoolean(cTID("Smoo"));
				thisPoint.push(smoothOr)
				}
			catch (e) {thisPoint.push(false)};
			theArray[theArray.length - 1].push(thisPoint);
			};
		theArray[theArray.length - 1].push(closed);
		theArray[theArray.length - 1].push(operation);
		};
	};
// by xbytor, thanks to him;
function cTID (s) { return cTID[s] || cTID[s] = app.charIDToTypeID(s); };
function sTID (s) { return sTID[s] || sTID[s] = app.stringIDToTypeID(s); };
// reset;
app.preferences.rulerUnits = originalRulerUnits;
return theArray;
};
////// from »Flatten All Masks.jsx« by jeffrey tranberry //////
function hasVectorMask() {
	var hasVectorMask = false;
	try {
		var ref = new ActionReference();
		var keyVectorMaskEnabled = app.stringIDToTypeID( 'vectorMask' );
		var keyKind = app.charIDToTypeID( 'Knd ' );
		ref.putEnumerated( app.charIDToTypeID( 'Path' ), app.charIDToTypeID( 'Ordn' ), keyVectorMaskEnabled );
		var desc = executeActionGet( ref );
		if ( desc.hasKey( keyKind ) ) {
			var kindValue = desc.getEnumerationValue( keyKind );
			if (kindValue == keyVectorMaskEnabled) {
				hasVectorMask = true;
			}
		}
	}catch(e) {
		hasVectorMask = false;
	}
	return hasVectorMask;
};
////// function to write a preference-file storing a text //////
function writePref (theText, thePath) {
try {
var thePrefFile = new File(thePath);
thePrefFile.open("w");
for (var m = 0; m < theText.length; m ++) {
thePrefFile.write(theText[m])
};
thePrefFile.close()
}
catch (e) {};
};

[javaer]

Can you provide your psd file? When using the psd I uploaded, hasVectorMask() returns false when executing the script

[javaer]

The vector mask data can be obtained, but an error occurs when converting to svg

[javaer]

After filtering abnormal coordinates, svg becomes normal