LineLayer
LineLayer¶
- LineLayer is a style layer that renders one or more stroked polylines on the map.
props¶
| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
| style | LineLayerStyleProps |
none |
false |
Customizable style attributes |
| sourceID | `` | VietmapGL.StyleSource.DefaultSourceID |
false |
styles¶
- lineCap
- lineJoin
- lineMiterLimit
- lineRoundLimit
- lineSortKey
- visibility
- lineOpacity
- lineColor
- lineTranslate
- lineTranslateAnchor
- lineWidth
- lineGapWidth
- lineOffset
- lineBlur
- lineDasharray
- linePattern
- lineGradient
lineCap¶
Name
lineCap
Description The display of line endings.
Type
enum
Default Value
butt
Supported Values
butt - A cap with a squared-off end which is drawn to the exact endpoint of the line.
round - A cap with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.
square - A cap with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.
Expression
Parameters: zoom
lineJoin¶
Name
lineJoin
Description The display of lines when joining.
Type
enum
Default Value
miter
Supported Values
bevel - A join with a squared-off end which is drawn beyond the endpoint of the line at a distance of one-half of the line's width.
round - A join with a rounded end which is drawn beyond the endpoint of the line at a radius of one-half of the line's width and centered on the endpoint of the line.
miter - A join with a sharp, angled corner which is drawn with the outer sides beyond the endpoint of the path until they meet.
Supported Style Functions
camera
Expression
Parameters: zoom, feature
lineMiterLimit¶
Name
lineMiterLimit
Description Used to automatically convert miter joins to bevel joins for sharp angles.
Type
number
Default Value
2
Expression
Parameters: zoom
lineRoundLimit¶
Name
lineRoundLimit
Description Used to automatically convert round joins to miter joins for shallow angles.
Type
number
Default Value
1.05
Expression
Parameters: zoom
lineSortKey¶
Name
lineSortKey
Description Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key.
Type
number
Expression
Parameters: zoom, feature
visibility¶
Name
visibility
Description Whether this layer is displayed.
Type
enum
Default Value
visible
Supported Values
visible - The layer is shown.
none - The layer is not shown.
lineOpacity¶
Name
lineOpacity
Description The opacity at which the line will be drawn.
Type
number
Default Value
1
Minimum
0
Maximum
1
Expression
Parameters: zoom, feature, feature-state
lineOpacityTransition¶
Name
lineOpacityTransition
Description
The transition affecting any changes to this layer’s lineOpacity propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineColor¶
Name
lineColor
Description The color with which the line will be drawn.
Type
color
Default Value
#000000
Disabled By
linePattern
Expression
Parameters: zoom, feature, feature-state
lineColorTransition¶
Name
lineColorTransition
Description
The transition affecting any changes to this layer’s lineColor propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineTranslate¶
Name
lineTranslate
Description The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively.
Type
array<number>
Default Value
[0,0]
Units
pixels
Expression
Parameters: zoom
lineTranslateTransition¶
Name
lineTranslateTransition
Description
The transition affecting any changes to this layer’s lineTranslate propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineTranslateAnchor¶
Name
lineTranslateAnchor
Description
Controls the frame of reference for lineTranslate.
Type
enum
Default Value
map
Supported Values
map - The line is translated relative to the map.
viewport - The line is translated relative to the viewport.
Requires
lineTranslate
Expression
Parameters: zoom
lineWidth¶
Name
lineWidth
Description Stroke thickness.
Type
number
Default Value
1
Units
pixels
Minimum
0
Supported Style Functions
camera
Expression
Parameters: zoom, feature, feature-state
lineWidthTransition¶
Name
lineWidthTransition
Description
The transition affecting any changes to this layer’s lineWidth propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineGapWidth¶
Name
lineGapWidth
Description Draws a line casing outside of a line's actual path. Value indicates the width of the inner gap.
Type
number
Default Value
0
Units
pixels
Minimum
0
Expression
Parameters: zoom, feature, feature-state
lineGapWidthTransition¶
Name
lineGapWidthTransition
Description
The transition affecting any changes to this layer’s lineGapWidth propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineOffset¶
Name
lineOffset
Description The line's offset. For linear features, a positive value offsets the line to the right, relative to the direction of the line, and a negative value to the left. For polygon features, a positive value results in an inset, and a negative value results in an outset.
Type
number
Default Value
0
Units
pixels
Expression
Parameters: zoom, feature, feature-state
lineOffsetTransition¶
Name
lineOffsetTransition
Description
The transition affecting any changes to this layer’s lineOffset propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineBlur¶
Name
lineBlur
Description Blur applied to the line, in pixels.
Type
number
Default Value
0
Units
pixels
Minimum
0
Expression
Parameters: zoom, feature, feature-state
lineBlurTransition¶
Name
lineBlurTransition
Description
The transition affecting any changes to this layer’s lineBlur propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineDasharray¶
Name
lineDasharray
Description
Specifies the lengths of the alternating dashes and gaps that form the dash pattern. The lengths are later scaled by the line width. To convert a dash length to pixels, multiply the length by the current line width. Note that GeoJSON sources with lineMetrics: true specified won't render dashed lines to the expected scale. Also note that zoomDependent expressions will be evaluated only at integer zoom levels.
Type
array<number>
Units
line widths
Minimum
0
Disabled By
linePattern
Expression
Parameters: zoom
lineDasharrayTransition¶
Name
lineDasharrayTransition
Description
The transition affecting any changes to this layer’s lineDasharray propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
linePattern¶
Name
linePattern
Description Name of image in sprite to use for drawing image lines. For seamless patterns, image width must be a factor of two (2, 4, 8, ..., 512). Note that zoomDependent expressions will be evaluated only at integer zoom levels.
Type
resolvedImage
Expression
Parameters: zoom, feature
linePatternTransition¶
Name
linePatternTransition
Description
The transition affecting any changes to this layer’s linePattern propery.
Type
{ duration, delay }
Units
milliseconds
Default Value
{duration: 300, delay: 0}
lineGradient¶
Name
lineGradient
Description
Defines a gradient with which to color a line feature. Can only be used with GeoJSON sources that specify "lineMetrics": true.
Type
color
Disabled By
lineDasharray, linePattern
Expression
Parameters: line-progress