# Line Layer
A line layer renders map features as lines. The layer data source should supply line or polygon data. The width (in pixels) of a line is specified by the line-width property. Line layers can be used to add styled polygon outlines above a fill layer.
<flow-map-layer type="line" ...>
line-color: red;
line-width: 2;
</flow-map-layer>
# Layout Properties
▸ line-cap (opens new window)
Optional enum (default: butt).
| Value | Description |
|---|---|
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. |
The display of line endings.
▸ line-join (opens new window)
Optional enum (default: miter).
| Value | Description |
|---|---|
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. |
The display of lines when joining.
▸ line-miter-limit (opens new window)
Optional number (default: 2).
Used to automatically convert miter joins to bevel joins for sharp angles.
▸ line-round-limit (opens new window)
Optional number (default: 1.05).
Used to automatically convert round joins to miter joins for shallow angles.
▸ line-sort-key (opens new window)
number.
Sorts features in ascending order based on this value. Features with a higher sort key will appear above features with a lower sort key.
# Paint Properties
▸ line-opacity (opens new window)
Optional number (default: 1): between 0 and 1 inclusive.
The opacity at which the line will be drawn.
▸ line-color (opens new window)
Optional color (default: #000000).
The color with which the line will be drawn.
▸ line-translate (opens new window)
Optional array (default: 0,0).
The geometry's offset. Values are [x, y] where negatives indicate left and up, respectively.
▸ line-translate-anchor (opens new window)
Optional enum (default: map).
| Value | Description |
|---|---|
map | The line is translated relative to the map. |
viewport | The line is translated relative to the viewport. |
Controls the frame of reference for
line-translate.▸ line-gap-width (opens new window)
Optional number (default: 0): minimum = 0.
Draws a line casing outside of a line's actual path. Value indicates the width of the inner gap.
▸ line-offset (opens new window)
Optional number (default: 0).
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.
▸ line-blur (opens new window)
Optional number (default: 0): minimum = 0.
Blur applied to the line, in pixels.
▸ line-dasharray (opens new window)
array: minimum = 0.
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 zoom-dependent expressions will be evaluated only at integer zoom levels.▸ line-pattern (opens new window)
resolvedImage.
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 zoom-dependent expressions will be evaluated only at integer zoom levels.
▸ line-gradient (opens new window)
color.
Defines a gradient with which to color a line feature. Can only be used with GeoJSON sources that specify
"lineMetrics": true.