User Tools

This is an old revision of the document!


A path is simply a series of points, connected by lines. A path can be open or closed (an additional line is drawn between the first and last point).

Paths are supported through the CSG.Path2D class. The difference between a Path and a CAG is that a path is a 'thin' line, whereas a CAG is an enclosed area.

Paths can be constructed either by giving the constructor an array of points, or through the various functions, which include:

  • arc(endpoint, options): return a circular or ellipsoid curved path (see example below for usage).
  • appendPoint([x,y]): create & return a new Path containing the callee's points followed by the given point.
  • appendPoints(165
  • appendBezier([[x,y],…], options): create & return a new Path containing the callee's points followed by a Bezier curve ending at the last point given; all but the last point given are the control points of the Bezier; a null initial control point means use the last two points of the callee as control points for the new Bezier curve. options can specify {resolution: <NN>}.

Paths can be concatenated with .concat(), the result is a new path.

A path can be converted to a CAG in two ways:

  • expandToCAG(pathradius, resolution) traces the path with a circle, in effect making the path's line segments thick.
  • innerToCAG() creates a CAG bounded by the path. The path must be a closed.

Creating a 3D solid is currently supported by the rectangularExtrude() function. This creates a 3D shape by following the path with a 2D rectangle (upright, perpendicular to the path direction):

var path = new CSG.Path2D([ [10,10], [-10,10] ], /* closed = */ false);
var anotherpath = new CSG.Path2D([ [-10,-10] ]);
path = path.concat(anotherpath);
path = path.appendPoint([10,-10]);
path = path.close(); // close the path
// of course we could simply have done:
// var path = new CSG.Path2D([ [10,10], [-10,10], [-10,-10], [10,-10] ], /* closed = */ true);
// We can make arcs and circles:
var curvedpath = CSG.Path2D.arc({
  center: [0,0,0],
  radius: 10,
  startangle: 0,
  endangle: 180,
  resolution: 16,