CompoundPath
Constructors
Constructs a compound path from one or more sub-paths.
Constructs a compound path from a SVG path string.
Path strings are a compact representation of canvas-style (move to, line
to, etc) drawing commands used by the SVG <path> element.
svgPathStringstringA valid SVG path string
Methods inherited from Geometry
Transforms this geometry.
A transform can optionally specify any of position, rotation, scale,
skew and origin.
origin defines the center (in pre-transform coordinates) of the
transformation for rotation, scale and skew.
// Simple translation
geometry.translate({
position: Vec(1, 0),
});
// Rotation and scale
geometry.transform({
rotation: 45,
scale: 2,
});
// Complicated transform
geometry.transform({
position: Vec(1, 1),
rotation: 180,
scale: Vec(2, 1),
skew: 45,
origin: Vec(-0.5, 0.5),
};
transformgeometriesGeometry[]An array of geometries to intersect with.
areaOfInterestIf supplied, only intersection results inside this bounding box will be returned. This can save a lot of computation if you only need to find intersections within a small area.
Returns An array of intersections between this geometry and geometries
geometriesGeometry[]An array of geometries to find overlaps with.
areaOfInterestIf supplied, input geometry will be filtered so that only parts that intersect this bounding box will be tested. This can save a lot of time if only need to find overlaps within a small area.
tolerancenumberThe maximum distance apart two segments can be to be considered overlapping.
Returns An array of overlaps between this geometry and geometries
targetGeometryThe geometry to move toward.
directionThe direction to move in. This should point towards the target geometry, otherwise no intersection may be found.
optionsReturns approximately the smallest distance to move until this geometry intersects the target geometry.
If minOverlap is specified, the distance to move until the geometry
overlaps by some minimum width will be returned instead.
Returns undefined if no intersection is found.
Clone is useful when you need to make a change to geometry without changing the original.
const transformedPath = path.clone().transform({ rotation: 45 });
Returns A deep copy of this geometry
Returns true if this geometry is valid, or false otherwise.
Spatially transforms this geometry by an affine transformation matrix.
Affine matrices can represent any 2-dimensional transformation that keeps lines parallel.
affineMatrixSpatially transforms this geometry by an affine transformation matrix, excluding translation. Only rotation, scale, and skew transformations will be applied.
affineMatrixThe loose bounding box may not be the smallest possible, but it's usually cheaper to compute. Use this when the exact bounding box isn't required.
Returns an axis-aligned bounding box that contains this geometry.
Returns the smallest axis-aligned bounding box that contains this geometry.
Geometry is contained by a bounding box if no part of it lies beyond it's minimum and maximum.
boxGeometry intersects a bounding box if part of the geometry crosses the boundary between the inside and outside of the box.
boxGeometry is overlapped by a bounding box if a point can be chosen that is indside both the geometry and the box.
Geometry is overlapped by a bounding box if it's contained inside, or intersected by it.
boxpointThe target point
areaOfInterestIf supplied, only results inside this bounding box
will be returned. This can save a lot of computation if you only need to
find closest points within a small area. Typically areaOfInterest is
centered on point, but this isn't required.
Returns The closest point to point that lies on this geometry, or
undefined if no point is found.
Reverses this geometry.
aunknownReturns true if graphic is a valid graphic
Methods inherited from Graphic
Returns all compound paths contained within this graphic, recursively.
Returns all paths contained within this graphic, recursively.
Returns all anchors contained within this graphic, recursively.
Returns all paths and compound paths contained within this graphic, recursively.
Returns true if this graphic has either a stroke or a fill.
Removes a fill style from this graphic.
Removes a stroke style from this graphic.
Assigns both a stroke and fill style to this graphic.
Scales the stroke width of this graphic by scaleFactor.
scaleFactornumberThe amount to scale existing strokes by
Returns The first styled graphic (Path or CompoundPath) in a group, or the styled path itself. A path must have either a stroke or fill to be considered styled.
Returns true if this graphic's style contains point.
This method differs from containsPoint() in that it takes the stroke and
fill styling into account.
Returns all paths grouped by their stroke and fill colors.
Paths must have identical stroke and fill colors to be grouped together.
A path made up of several sub-paths. Cuttle uses the "evenodd" fill rule when rendering compound paths. This means that two overlapping sub-paths will create a hole.