: How to create a vector curve programmatically? I want to create a vector curve that is symmetric in the top and the bottom. For example, in this baseball icon (How to draw a baseball in Pixelmator?),

@Kimberly620

This question contains two separate issues,


how to do things programmatically and
how do you model precise shapes.


For all intents and purposes these are unrelated. Seems to me that the only reason you ask the first question is because you are not aware of how to precisely position items within the GUI, but I may be wrong. I will be demonstrating Adobe Illustrator because that's what i have at hand.

Precise Position with GUI Tools

The first way to precisely position things is to use a grid, and grid snap. This is a GUI equivalent concept to using only x digits of precision while typing values. When you reduce where you can position points its more likely that you can replicate positioning elsewhere. Symmetrical handle positioning lead to symmetrical results.



Image 1: Snapping to grid makes positioning predictable.

Another way would be to draw exactly half of your shape and use the mirror tool to produce the symmetrical half. Yet another way to do this is to use a small curve as a protractor and then snap to its points. So you see there are many options to do this without bothering to go to the script layer.

Programmatic Positioning Using Adobe ExtendScript

Adobe provides a platform agnostic javaScript implementation called ExtendScript. A script to mimic what was done by hand would look as follows:
#target illustrator

var doc = app.activeDocument;
var pathItem = doc.pathItems.add();

pts = [[0,0], [5,0], [5,5], [0,5]]

// match units of drawn document
// convert points to 2 * mm
for(var i=0; i< pts.length; i++) {
for(var j=0; j< pts[i].length; j++) {
pts[i][j] *= 2 * 2.83464567;
}
}

var point1 = pathItem.pathPoints.add();
point1.anchor = pts[0];
point1.leftDirection = point1.anchor;
point1.rightDirection = pts[1];

var point2 = pathItem.pathPoints.add();
point2.anchor = pts[3];
point2.leftDirection = pts[2];
point2.rightDirection = point2.anchor;

pathItem.stroke = true;
pathItem.fill = false;


Just paste this into extendscript toolkit to test, or put in a .jsx file

Programmatic Positioning Using Files (Postscript)

Sometimes you want to use a arbitrary program to generate vector drawings. The sane choices for output formats that can do this are:


PS/EPS, (Encapsulated) PostScript
PDF, Portable Document Format
SVG, Scalable Vector Graphics
DXF, Drawing eXhange Format
EMF, Enhanced Metafile


Of these formats EPS and DXF are least convolved. SVG is also a good choice but a bit overly verbose, and still as cryptic as PDF drawing layers. PDF is also possible to generate but unless you have a drawing API it is extra work (Like QT or Cairo, but its by no means hard just a bit convoluted). I use EPS because i need to write EPS sometimes by hand so its familiar to me.

Drawing the above shape in a EPS file would look as follows:

%!PS-Adobe-3.0 EPSF-3.0
%%BoundingBox: 0 0 40 40
%%Title: Graph Drawing
%%Creator: Janne Ojala
%%CreationDate: 2013-03-23
%%EndComments

% optional stuff to get
% same scale as my settings
/mm {2.83464567 mul} def
2 mm dup scale % 1 unit = 2 mm
1 2 mm div setlinewidth
1 1 translate % offset
% end optional

newpath
0 0 moveto
5 0 5 5 0 5 curveto
stroke

%%EOF


Where the first sections first line is obligatory as well as the last %%EOF. The meat of the drawing is done with moveto and curve to where the number pairs are the 4 control points. Just put this in a text file with a .eps extension and use normally.

Results

Comparing solutions you can see that the javaScript approach is a quite cumbersome compared to the alternatives.



Image 2: Comparasion between the hand drawn (in red), javaScript (in green) and EPS curve (black)

For more resources read:


My older post on a simillar subject, also some notes on programmatic access in same thread but under different answer. It includes a Tip for getting a feedback on the eps file while developing it and how to interface on windows in python via COM API.
Postscript Reference
Illustrator scripting reference




TL;DR

Yes, you can programmatically make a curve. Precision however does not require this. This post contains 2 approaches for programmable acess, and one discussion on how to do the same thing in the GUI.

Vote Up Vote Down

@Kevin459

If I understand your question correctly, Arc Correction by S.H. will work for you. I haven't tried it myself, but it looks like it would do the job.

Vote Up Vote Down