How can I create a path with Bézier curves using a script?

by

I have a script which makes a simple shape* for me:

var docRef = documents.add();
var piRef = activeDocument.pathItems;

{
    var pathRef = piRef.add();
    pathRef.setEntirePath( new Array(
        new Array(475,543.30078125),
        new Array(450,500),
        new Array(475,456.69873046875),
        new Array(525,456.69873046875),
        new Array(550,500),
        new Array(525,543.30078125),
        new Array(475,543.30078125) ) ) ;
}

However, the shape(s) which I create are limited to straight paths, how could I change this to be creating paths with curved edges?

I’m pretty new and inexperienced to Illustrator scripting, I’m sure there’s a better way for me to be making this path in the first place.

I use this script from Wolff in order to extract my path coordinates (after creating the path in Illustrator), I assume I’d have to modify that as well in order to have it export round paths.

*The shape being a hexagon is irrelevant, the idea is to be able to create arbitrary shapes.

Answer

You can’t do it with setEntirePath, you have to make a new pathItem (Document.pathItems.add()) and then you have to add your path points individually.

You would do this via:

var myPath = app.activeDocument.pathItems.add();

var newPoint = myPath.pathPoints.add();
newPoint.leftDirection = [10, -5];
newPoint.anchor = [0, 0];
newPoint.rightDirection = [-10, 5];

Now when you add more, this will form your Bezier curve! 

var doc = app.activeDocument;
var myPath = doc.selection[0];
var pathPointArray = [];
var thisPoint;
for(var i = 0; i < myPath.pathPoints.length; i++){
    thisPoint = myPath.pathPoints[i];
    pathPointArray.push([
        [
            thisPoint.leftDirection[0],
            thisPoint.leftDirection[1]
        ],
        [
            thisPoint.anchor[0],
            thisPoint.anchor[1]
        ],
        [
            thisPoint.rightDirection[0],
            thisPoint.rightDirection[1]
        ]
    ]);
}
alert(pathPointArray.join("\n"));

Here’s the result:

The REAL result!

And here’s one where the entire thing is put together whereby it gathers the coordinates from your selection and creates a duplicate item of the same thing (without using copy/pasting or duplicate commands) exactly 100 points above the initial selection.

    var doc = app.activeDocument;
    var myPath = doc.selection[0];
    var pathPointArray = [];
    var thisPoint;
    for(var i = 0; i < myPath.pathPoints.length; i++){
        thisPoint = myPath.pathPoints[i];
        pathPointArray.push([
            [
                thisPoint.leftDirection[0],
                thisPoint.leftDirection[1]
            ],
            [
                thisPoint.anchor[0],
                thisPoint.anchor[1]
            ],
            [
                thisPoint.rightDirection[0],
                thisPoint.rightDirection[1]
            ]
        ]);
    }

    var myNewPath = doc.pathItems.add();
    var thisArrayPointObject;
    var newPoint;
    for(var i = 0; i < pathPointArray.length; i++){
        thisArrayPointObject = pathPointArray[i];
        newPoint = myNewPath.pathPoints.add();
        newPoint.leftDirection = [
            thisArrayPointObject[0][0],
            thisArrayPointObject[0][1] + 100
        ];
        newPoint.anchor = [
            thisArrayPointObject[1][0],
            thisArrayPointObject[1][1] + 100
        ];
        newPoint.rightDirection = [
            thisArrayPointObject[2][0],
            thisArrayPointObject[2][1] + 100
        ];
    };

And here is the result from that:

enter image description here

Attribution
Source : Link , Question Author : WELZ , Answer Author : Silly-V

Leave a Comment