Skip to main content
August 9, 2010
Question

gradientStops, their rampPoints, and gradientColor.angle

  • August 9, 2010
  • 3 replies
  • 1749 views

Hi,

Today marked my first attempts at Illustrator scripting; Illustrator's fairly new for me as well.  Please tolerate my ignorance.

First, would some kind person out there explain why a gradient is only allowed two gradientStops, indexed [0] and [1] (otherwise, an out-of-bounds index error is thrown my way)?  In a script I'd like to define and place several colors along a single gradient.  How does one do this?  I seem to be able to do this via Illustrator's Gradient window while not scripting.

Second, in CS5 has the gradientColor.angle bug been fixed?  (See post at http://forums.adobe.com/message/1104567#1104567 from two years ago.  Apparently this has been a problem for some time.)  My CS4 version doesn't seem to do anything with this property.

Many sincere thanks.  Before you ask, below is the script I've been playing with.

PAS


var myDoc = app.documents.add ( DocumentColorSpace.CMYK );
var myLayer = myDoc.layers.add ( );
var myTrianglePath = myLayer.pathItems.add ( );

var myPureCyan = new CMYKColor ( );
myPureCyan.cyan = 100;
myPureCyan.magenta = 0;
myPureCyan.yellow = 0;
myPureCyan.black = 0;

var myPureMagenta = new CMYKColor ( );
myPureMagenta.cyan = 0;
myPureMagenta.magenta = 100;
myPureMagenta.yellow = 0;
myPureMagenta.black = 0;

var myPureYellow = new CMYKColor ( );
myPureYellow.cyan = 0;
myPureYellow.magenta = 0;
myPureYellow.yellow = 100;
myPureYellow.black = 0;

var myGradient = app.activeDocument.gradients.add ( );
myGradient.type = GradientType.LINEAR;

myGradient.gradientStops[0].rampPoint = 0;
myGradient.gradientStops[0].midPoint = 30;
myGradient.gradientStops[0].color = myPureCyan;
myGradient.gradientStops[0].opacity = 100;

myGradient.gradientStops[1].rampPoint = 100;
// NONSENSICAL TO HAVE A SECOND MIDPOINT
// IF THIS IS THE FINAL PERMITTED GRADIENTSTOP
// myGradient.gradientStops[1].midPoint = 50;
myGradient.gradientStops[1].color = myPureMagenta;
myGradient.gradientStops[1].opacity = 0;

// MULTIPLE GRADIENTSTOPS NOT PERMITTED?
// myGradient.gradientStops[2].rampPoint = 100;
// myGradient.gradientStops[2].color = myPureYellow;
// myGradient.gradientStops[2].opacity = 100;

var myGradientFillColor = new GradientColor ( );
// GRADIENTCOLOR ANGLE ISN'T WORKING?
myGradientFillColor.angle = 45;
myGradientFillColor.gradient = myGradient;

myTrianglePath.setEntirePath ( [ [100,100], [500,100], [500, 700] ] );
myTrianglePath.stroked = true;
myTrianglePath.filled = true;
myTrianglePath.fillColor = myGradientFillColor;

This topic has been closed for replies.

3 replies

August 9, 2010

Hi all,

Regarding gradient angle, apparently all I need to do is add the following line to the code originally posted.  ('60' and 'CENTER' are alterable.)

myTrianglePath.rotate ( 60, false, false, true, false, Transformation.CENTER );

Someone by the name of John Wundes gets credit for that solution, as dutifully noted on a third-party website where I found this line of code.

I suppose I'd first better learn some Javascript basics, like if-thens, loops, function calls, and the like....

Graciously,

PAS

August 9, 2010

Well, folks, I'm stumped.

How do you fill a path with a linear gradient where that gradient is assigned an angle?  (Ie, something other than default 0 degrees.)

Accolades for the person(s) who figures this out.

PAS (wuquai)

Muppet_Mark-QAl63s
Inspiring
August 9, 2010

I have NOT looked at this just yet… But the 2 links in which you posted are relating to scripting InDesign? I will do  a few checks when In get a little time…

Muppet_Mark-QAl63s
Inspiring
August 9, 2010

Making a new gradient by default must have 2 colours and a mid point. Once you have made a gradient and referenced it. You can use gradientStops.add() to give you extra stops that you require…

Edit a gradient like so…

var thisStop = doc.gradients.getByName(grName).gradientStops[idx]; thisStop.color = grCol; thisStop.midPoint = grMP; // 13-87 thisStop.rampPoint = grRP; // 0-100

Add extra stops…

var thisStop = doc.gradients.getByName(grName).gradientStops.add(); thisStop.color = grCol; thisStop.midPoint = grMP; // 13-87 thisStop.rampPoint = grRP; // 0-10

You could also use a function if you are making lots of colours…

function cmykColor(c, m, y, k) {      var newCMYK = new CMYKColor();      newCMYK.cyan = c;      newCMYK.magenta = m;      newCMYK.yellow = y;      newCMYK.black = k;      return newCMYK; }

August 9, 2010

Thanks, Muppet Mark.  I'll give the gradientStops.add() a go.  (And a color 'function' -- wow, who thought that up?!  What a flexible time-saver idea!)

Regarding gradient angle, a couple other past posts came up:  http://forums.adobe.com/message/2308427#2308427 and http://forums.adobe.com/message/1106712#1106712 both mention a 'gradientFillAngle property.  I'll see what I can do with this.

PAS (wuquai)

ps: Is there a page dedicated to formatting suggestions for Adobe Forum posts?  For things like XML-tagging code snippets to a different font?  How did you set your code snippets off in separate boxes?

Muppet_Mark-QAl63s
Inspiring
August 9, 2010

When in the posting widow go to…

Paste your code into that box job done…