Creating Predefined Shapes

Paper.js allows you to create path items with predefined shapes of variable dimensions.

In the same way that the new Path() constructor creates an empty path with no points, we have constructors such as new Path.Circle(center, radius) and new Path.Rectangle(point, size) that create paths and automatically add segments to them to create predefined shapes.
Paper.js allows you to create path items with predefined shapes of variable dimensions.

Using the new Path.Circle(center, radius) constructor, we can produces circle shaped paths.

The following code produces a circle shaped path with a center point at {x: 100, y: 70} and a radius of 50 pt:

To create a rectangular shaped path you can pass a Rectangle to the new Path.Rectangle(rect) constructor.

For example, let's make a Rectangle between {x: 0, y: 0} and {x: 50, y: 50} and then use the new Path.Rectangle(rect) constructor to create a path with the shape that it describes:

To create rectangular shaped paths with rounded corners, we use the new Path.Rectangle(rectangle, radius) constructor. The rectangle parameter describes the Rectangle and the radius parameter describes the Size of the rounded corners.

For example, the following script creates a rectangular shaped path with 20 pt * 20 pt corners:

To create regular polygon shaped paths, we use the new Path.RegularPolygon(center, sides, radius) constructor.

The center parameter describes the center point of the polygon, the sides parameter describes the amount of sides the polygon has and the radius parameter describes the radius of the polygon.

For example, lets create a triangle shaped path and a decagon shaped path: