meta data for this page
2D Primitives
‘2D’ stands for two (2) dimensional. A 2D primitive is any shape that has two dimensions, which are width and length (or X and Y.) The 2D dimensional shapes have no thickness (Although, JSCAD shows a very thin shape.)
One way of thinking about 2D shapes is anything that lays flat on a piece of paper, such as drawing a circle or a square.
The mathematical study of 2D shapes and dimensions is called plane geometry.
Resolution of Shapes
All rounded shapes have a segments
option which controls tessellation. If segments
is set to 8, then 8 segments are used to create PI * 2 radians of revolution. If the segments
option is omitted, the default value is used.
This allows each design to control the amount of detail present, but beware that calculations and rendering time will also increase. For example, the number of polygons increases quadratically with each increase of the segments
for spheres.
Rectangle
A two dimensional shape made with four straight sides where all interior angles are right angles (90°).
Learn about rectangles at MathIsFun.com
The size
specifies the size across X and Y axis. Rectangles can be created at a requested center
.
Defaults:
- size : [2, 2]
- center : [0, 0]
const { rectangle } = require('@jscad/modeling').primitives const myshape = rectangle({size: [3, 4]}) const myshape = rectangle({size: [3, 4], center: [5, 5]})
Square
The specialized square primitive also exists, but requires only one number value for all sides.
Defaults:
- size : 2
- center : [0, 0]
const { square } = require('@jscad/modeling').primitives const myshape = square({size: 3}) const myshape = square({size: 3, center: [5, 5]})
Rounded Rectangle
Rounded rectangles can be created by specifying a roundRadius
for the corners.
Defaults:
- size : [2, 2]
- center : [0, 0]
- roundedRadius: 0.2
- segments: 32
const { roundedRectangle } = require('@jscad/modeling').primitives const myshape = roundedRectangle({size: [10, 20], roundRadius: 2}) const myshape = roundedRectangle({size: [10, 20], roundRadius: 2, center: [5, 5], segments: 64})
Ellipse
A two dimensional shape that surrounds two focal points, such that for all points on the curve, the sum of the two distances to the focal points is a constant.
The radius
determines the size of the ellipsoid about X and Y axis. Ellipsoids can be created at a requested center
. The segments
specify the number of segments to create per full rotation.
Defaults:
- radius : [1, 1]
- center : [0, 0]
- startAngle : 0
- endAngle : PI * 2
- segments: 32
const { ellipse } = require('@jscad/modeling').primitives const myshape = ellipse({radius: [5, 10]}) const myshape = ellipse({radius: [5, 10], center: [5, 5], startAngle: Math.PI / 2, endAngle: Math.PI, segments: 64})
Circle
A two dimensional shape made by drawing a curve that is always the same distance from a center. All points are the same distance from the center.
Learn about circles at MathIsFun.com
The radius
specifies the size across both X and Y axis. Circles can be created at a requested center
. The segments
specify the number of segments to create per full rotation.
Defaults:
- radius : 1
- center : [0, 0]
- segments: 32
const { circle } = require('@jscad/modeling').primitives const myshape = circle({radius: 10}) const myshape = circle({radius: 10, center: [5, 5], startAngle: Math.PI / 2, endAngle: Math.PI, segments: 64})
Polygon
A two dimensional shape with straight sides, and the shape is “closed” (all the sides connect up).
Learn about polygons at MathIsFun.com
NOTE: The ordering of points is VERY IMPORTANT. If the polygon is going to be extruded then the points must be in counter-clockwise order, otherwise the faces of the object will be facing inwards. See Orientation.
HINT: Polygons should have a positive area.
The following show examples of creating polygons from a list of points.
Defaults:
- empty
const { polygon } = require('@jscad/modeling').primitives const myshape = polygon({ points: [ [0,0],[3,0],[3,3] ] })
Star
A two dimensional shape made from straight rays extending from a center. All vertices are the same distance from the center.
Note: See the paper on The Inner Radius of n/m Stars by Julian D. A. Wiseman for more details.
Defaults:
- vertices : 5
- density : 2
- outerRadius : 1
- innerRadius : 0
- startAngle : 0
- center : [0, 0, 0]
const { star } = require('@jscad/modeling').primitives let star1 = star({vertices: 8, outerRadius: 10}) // star with 8/2 density let star2 = star({vertices: 12, outerRadius: 40, innerRadius: 20}) // star with given radius