Construct a DashedLine object, specifying any amount of its properties.
// Example, 1px thick dashed red line.
const solidRed = new DashedLine({
thickness: 1,
fillStyle: new SolidFill({ color: ColorRGBA( 255, 0, 0 ) }),
pattern: StipplePatterns.Dashed,
})
Axis.setStrokeStyle(solidRed)
Optional props: Partial<Omit<DashedLineProperties, "type" | "lineType">>Object containing any amount of DashedLine properties.
Readonly fillLine fill style.
Readonly lineReadonly patternStipple pattern that describes the repeating pattern of ON and OFF sections that defines the DashedLine.
See StipplePattern for more information.
Defaults to StipplePatterns.DashedEqual
Readonly patternScaling factor for the length of each repeating stipple pattern.
Defaults to 3
Readonly thicknessLine thickness.
-1 can be used to signify smallest available thickness. With most features, this will result in slightly better GPU performance, but less detailed line.
Default value: 1.
Readonly typeGet stipple pattern of the DashedLine object.
Stipple pattern.
Construct a new line style object based on this one, but with modified fill style.
Example (SolidFill):
// specify new fillstyle
lineStyle.setFillStyle( new SolidFill({
color: ColorHex('#F00')
}) )
// change fillstyle properties
lineStyle.setFillStyle(
solidfill => solidfill.setA( 80 )
)
New SolidLine object
Either a DashedLine object or a function, which will be used to create a new DashedLine based on current value.
Construct a new DashedLine object based on this one, but with modified stipple pattern.
Use StipplePatterns to conveniently select from preset options.
// Example usage
const modifiedDashedLine = DashedLine.setPattern(StipplePatterns.Dashed)
New DashedLine object.
Stipple pattern.
Construct a new DashedLine object based on this one, but with modified stipple pattern scale.
Scaling factor for the length of each repeating stipple pattern. By default 5.
New DashedLine object.
Scaling factor.
Construct a new DashedLine object based on this one, but with modified thickness.
-1 can be used to signify smallest available thickness. With most features, this will result in slightly better GPU performance, but less detailed line.
Thickness as pixels.
Style class for describing a line that is partly hidden and partly visible. The pattern is repetitive and can be configured.
Instances of DashedLine, like all LCJS style classes, are immutable, meaning that its setters don't modify the actual object, but instead return a completely new modified object.
Properties of DashedLine:
thickness: thickness of line as pixels.fillStyle: description of line fill color. The supported fillStyles vary per component.pattern: description of the repeating pattern of ON and OFF sections that defines theDashedLine.patternScale: scaling factor for the length of each repeating stipple pattern.DashedLine Usage:
Use DashedLine with:
setStrokeStylemethods:Watch out! A common misuse is to attempt styling strokes or borders directly using fill style or color. Remember, when calling a
setStrokeStylemethod, a line style is expected! Carefully observe the order of wrapped styles: line style <- fill style <- colorRelated information:
For more line styles, see: