Question. How can I update the artboards[artboard].artboardRect through script?

[DavidBeczuk]

Hi guys. I discovered that exporting assets like artboards can cause unwanted sized exports. Usually having extra pixels due to positioning of artboards on positions with decimals.

To fix this issue I want to make a script that rounds these coordonates and updates the artboard position.

Here is the script for now that deals with the issue. However I cannot find a way to create a Rect type value in order to update the specific artboardRect. Can anyone help me please in solving this?

What I found out up until now is that in order for me to update the position of the arboard I need to pass it a Rect type element. But I don't know how to do this.

// Get current document
var doc = app.activeDocument;
var artboards = doc.artboards;
var artboardsLen =  artboards.length;
var fixedRect = [];
alert(fixedRect);
// alert(artboards[0]);
for( i = 0; i <= artboardsLen - 1; i++ ) {
	alert(artboards[i].artboardRect);
	for (j = 0; j <= artboards[i].artboardRect[j]; j++) {
		fixedRect.push(Math.floor(artboards[i].artboardRect[j]));
	}
	alert("Fixed Rect" + fixedRect);
	// fixedRect = [];
}

[DavidBeczuk]

Okay I think this solved my Issue.
If you have a better way to do it please let me know.

// Get current document
var doc = app.activeDocument;
var artboards = doc.artboards;
var artboardsLen =  artboards.length;
var fixedRect = doc.pathItems.rectangle;

for( i = 0; i <= artboardsLen - 1; i++ ) {
	// alert("Initial: " + artboards[i].artboardRect);
	
	var x = Math.floor(artboards[i].artboardRect[0]);
	var y = Math.floor(artboards[i].artboardRect[1]);
	var w = Math.floor(artboards[i].artboardRect[2]);
	var h = Math.floor(artboards[i].artboardRect[3]);
	
	artboards[i].artboardRect = [x,y,w,h];
}

[femkeblanco]

That is how you do it.  There is no better way. 

[Disposition_Dev · Accepted solution]

I don't necessarily have a "better" way to handle it.. But in an attempt to stay modern as far as my javascript practices, i've implemented some modern javascript functionality, including array functions like .map() I have a centralized utilities file that gets includeded in every one of my scripts so i just always have access to those functions. Using map() you can cut your for loop down to one line. again. not saying this makes anything better, but it seems more consistent with most modern javascript i've seen.

#target Illustrator
function test() {

	Array.prototype.map = function(callback) {
		arr = [];
		for (var i = 0; i < this.length; i++)
			arr.push(callback(this[i], i, this));
		return arr;
	};
	
	var docRef = app.activeDocument;
	var ab = docRef.artboards;

	//loop each artboard and floor each value of its artboardRect
	for (var i = 0; i < ab.length; i++) {
		ab[i].artboardRect = ab[i].artboardRect.map(function(a){return Math.floor(a)});
	}
}
test();

just another option for those who want to type less and spend more time trying to read the code later. lol

[DavidBeczuk]

ab[i].artboardRect = ab[i].artboardRect.map(function(a){return Math.floor(a)});

Nice approach. You are updating the values on the fly. I am not used to work with map because I don't know its exact mechanics. So the map() creates a new array and calls a function that processes each element right? The (a) variable is in fact Element. Looks like a forEach loop.

Array.prototype.map = function(callback) {
		arr = [];
		for (var i = 0; i < this.length; i++)
			arr.push(callback(this[i], i, this));
		return arr;
	};

can you please explain to me why you are extending the map functionality? Sorry I am just a part time programming enthusiast.

[Disposition_Dev · Accepted solution]

You're mostly correct on how map() works. it executes the callback function on each element of the given array sending the return value to a new array and then returns a new array. The difference between String.map() and String.foreach() is that foreach() might update the array rather than returning a new one. Since memory is essentially free these days, i'll always opt to retain the original array just in case.

I'm not extending the map functionality. It doesn't exist by default in Extendscript, so if we want to use it, we have to add the functionality explicitly. the "Javascript" we use to script adobe software isn't actually javascript. It's a clone of ES3 Javascript that doesn't have most of the new fancy bells and whistles that the web dev community has access to (though, that's changing soon with UXP as far as i understand. that will leverage node.js.. all the more reason to get used to writing it.)

So yea. I had to create that prototype to allow for the use of the map() functionality. I also want to stress again that this isn't necessarily a better way of doing this. It fundamentally does the same thing as @DavidBeczuk 's code. It's just less code to write (assuming you've just included the String.prototype.map() logic from a resource file). 

I recently read someone's opinion of the distinction between "Software Developer" and "Software Engineer" that i thought was quite intriguing. I had always assumed it was just two ways to say the same thing.. But this person put it like this, "A software developer uses the Array.sort() method. A software engineer writes the Array.sort() method". I think that concept is relevent here.

Some people getting into the software scene are going to want a high level experience and won't want to be dealing with the minutae of the math and logic. They're going to want as much of a "drag and drop" experience as possible. Put the function call and pass an argument or 2. This is where having helpful methods like map() and foreach() and reduce() and reverse() etc are appealing.

Other people will want a deeper understanding of exactly what's going on inside the code and they'll want to have lots of control over what happens. For these people, they might prefer to write their own helper functions instead, or just explicitly hard code the solution when it arises.

I just wanted to share options to accomodate the largest group of people.

[DavidBeczuk]

Thank you for the explanation 🙂