TextOptions interface

Reference

Package:: azure-maps-control

Options used to customize the text in a SymbolLayer

Extends: Options

Properties

allowOverlap	Specifies if the text will be visible if it collides with other symbols. If true, the text will be visible even if it collides with other previously drawn symbols. Default `false`.
anchor	Specifies which part of the icon is placed closest to the icons anchor position on the map. `"center"`: The center of the icon is placed closest to the anchor. `"left"`: The left side of the icon is placed closest to the anchor. `"right"`: The right side of the icon is placed closest to the anchor. `"top"`: The top of the icon is placed closest to the anchor. `"bottom"`: The bottom of the icon is placed closest to the anchor. `"top-left"`: The top left corner of the icon is placed closest to the anchor. `"top-right"`: The top right corner of the icon is placed closest to the anchor. `"bottom-left"`: The bottom left corner of the icon is placed closest to the anchor. `"bottom-right"`: The bottom right corner of the icon is placed closest to the anchor. Default `"center"`.
color	The color of the text. Default `"#000000"`.
font	The font stack to use for displaying text. Possible values: `"SegoeFrutigerHelveticaMYingHei-Bold"`, `"SegoeFrutigerHelveticaMYingHei-Medium"`, `"SegoeFrutigerHelveticaMYingHei-Regular"`, `"SegoeUi-Bold"`, `"SegoeUi-Light"`, `"SegoeUi-Regular"`, `"SegoeUi-SemiBold"`, `"SegoeUi-SemiLight"`, `"SegoeUi-SymbolRegular"`, `"StandardCondensedSegoeUi-Black"`, `"StandardCondensedSegoeUi-Bold"`, `"StandardCondensedSegoeUi-Light"`, `"StandardCondensedSegoeUi-Regular"`, `"StandardFont-Black"`, `"StandardFont-Bold"`, `"StandardFont-Light"`, `"StandardFont-Regular"`, `"StandardFontCondensed-Black"`, `"StandardFontCondensed-Bold"`, `"StandardFontCondensed-Light"`, `"StandardFontCondensed-Regular"`. Default `["StandardFont-Regular"]`.
haloBlur	The halo's fadeout distance towards the outside in pixels. Must be a number greater or equal to 0. Default `0`.
haloColor	The color of the text's halo, which helps it stand out from backgrounds. Default `"rgba(0,0,0,0)"`.
haloWidth	The distance of the halo to the font outline in pixels. Must be a number greater or equal to 0. The maximum text halo width is 1/4 of the font size. Default `0`.
ignorePlacement	Specifies if the other symbols are allowed to collide with the text. If true, other symbols can be visible even if they collide with the text. Default `false`.
justify	Text justification options. `"auto"`: The text is aligned towards the anchor position. `"left"`: The text is aligned to the left. `"center"`: The text is centered. `"right"`: The text is aligned to the right. Default `"center"`.
offset	Specifies an offset distance of the icon from its anchor in ems. Positive values indicate right and down, while negative values indicate left and up. Default `[0, 0]`.
opacity	A number between 0 and 1 that indicates the opacity at which the text will be drawn. Default `1`.
optional	Specifies if the text can be hidden if it is overlapped by another symbol. If true, icons will display without their corresponding text when the text collides wit other symbols and the icon does not. Default `false`.
padding	Size of the additional area around the text bounding box used for detecting symbol collisions. Default `2`.
pitchAlignment	Specifies the orientation of the text when the map is pitched. `"auto"`: Automatically matches the value of `rotationAlignment`. `"map"`: The text is aligned to the plane of the map. `"viewport"`: The text is aligned to the plane of the viewport. Default: `"auto"`
radialOffset	Radial offset of text, in the direction of the symbol's anchor. Useful in combination with `variableAnchor`, which defaults to using the two-dimensional `offset` if present. Default: `0`
rotation	The amount to rotate the text clockwise in degrees. Default `0`
rotationAlignment	In combination with the `placement` property of the `SymbolLayerOptions`, specifies the rotation behavior of the individual glyphs forming the text. `"auto"`: When the `placement` is set to `"point"`, this is equivalent to `"map"`. When the `placement` is set to `"line"` this is equivalent to `"map"`. `"map"`: When the `placement` is set to `"point"`, aligns text east-west. When the `placement` is set to `"line"`, aligns text x-axes with the line. `"viewport"`: Produces glyphs whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `placement`. Default: `"auto"`
size	The size of the font in pixels. Must be a number greater or equal to 0. Default `16`.
textField	Specifies the name of a property on the features to use for a text label.
variableAnchor	List of potential anchor locations, to increase the chance of placing high-priority labels on the map. The renderer will attempt to place the label at each location, in order, before moving onto the next label. Use `justify: "auto"` to choose text justification based on anchor position. To apply an offset use the `radialOffset` or two-dimensional `offset` options. `"center"`: The center of the icon is placed closest to the anchor. `"left"`: The left side of the icon is placed closest to the anchor. `"right"`: The right side of the icon is placed closest to the anchor. `"top"`: The top of the icon is placed closest to the anchor. `"bottom"`: The bottom of the icon is placed closest to the anchor. `"top-left"`: The top left corner of the icon is placed closest to the anchor. `"top-right"`: The top right corner of the icon is placed closest to the anchor. `"bottom-left"`: The bottom left corner of the icon is placed closest to the anchor. `"bottom-right"`: The bottom right corner of the icon is placed closest to the anchor. Default: `undefined`

Property Details

allowOverlap

Specifies if the text will be visible if it collides with other symbols. If true, the text will be visible even if it collides with other previously drawn symbols. Default false.

allowOverlap?: boolean

Property Value

boolean

anchor

Specifies which part of the icon is placed closest to the icons anchor position on the map.

`"center"`: The center of the icon is placed closest to the anchor.

`"left"`: The left side of the icon is placed closest to the anchor.

`"right"`: The right side of the icon is placed closest to the anchor.

`"top"`: The top of the icon is placed closest to the anchor.

`"bottom"`: The bottom of the icon is placed closest to the anchor.

`"top-left"`: The top left corner of the icon is placed closest to the anchor.

`"top-right"`: The top right corner of the icon is placed closest to the anchor.

`"bottom-left"`: The bottom left corner of the icon is placed closest to the anchor.

`"bottom-right"`: The bottom right corner of the icon is placed closest to the anchor.

Default `"center"`.

anchor?: PositionAnchor | DataDrivenPropertyValueSpecification<PositionAnchor>

Property Value

PositionAnchor | DataDrivenPropertyValueSpecification<PositionAnchor>

color

The color of the text. Default "#000000".

color?: string | DataDrivenPropertyValueSpecification<string>

Property Value

string | DataDrivenPropertyValueSpecification<string>

font

The font stack to use for displaying text. Possible values: "SegoeFrutigerHelveticaMYingHei-Bold", "SegoeFrutigerHelveticaMYingHei-Medium", "SegoeFrutigerHelveticaMYingHei-Regular", "SegoeUi-Bold", "SegoeUi-Light", "SegoeUi-Regular", "SegoeUi-SemiBold", "SegoeUi-SemiLight", "SegoeUi-SymbolRegular", "StandardCondensedSegoeUi-Black", "StandardCondensedSegoeUi-Bold", "StandardCondensedSegoeUi-Light", "StandardCondensedSegoeUi-Regular", "StandardFont-Black", "StandardFont-Bold", "StandardFont-Light", "StandardFont-Regular", "StandardFontCondensed-Black", "StandardFontCondensed-Bold", "StandardFontCondensed-Light", "StandardFontCondensed-Regular". Default ["StandardFont-Regular"].

font?: string[] | DataDrivenPropertyValueSpecification<string[]>

Property Value

string[] | DataDrivenPropertyValueSpecification<string[]>

haloBlur

The halo's fadeout distance towards the outside in pixels. Must be a number greater or equal to 0. Default 0.

haloBlur?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

haloColor

The color of the text's halo, which helps it stand out from backgrounds. Default "rgba(0,0,0,0)".

haloColor?: string | DataDrivenPropertyValueSpecification<string>

Property Value

string | DataDrivenPropertyValueSpecification<string>

haloWidth

The distance of the halo to the font outline in pixels. Must be a number greater or equal to 0. The maximum text halo width is 1/4 of the font size. Default 0.

haloWidth?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

ignorePlacement

Specifies if the other symbols are allowed to collide with the text. If true, other symbols can be visible even if they collide with the text. Default false.

ignorePlacement?: boolean

Property Value

boolean

justify

Text justification options.

`"auto"`: The text is aligned towards the anchor position.

`"left"`: The text is aligned to the left.

`"center"`: The text is centered.

`"right"`: The text is aligned to the right. Default `"center"`.

justify?: "auto" | "left" | "center" | "right"

Property Value

"auto" | "left" | "center" | "right"

offset

Specifies an offset distance of the icon from its anchor in ems. Positive values indicate right and down, while negative values indicate left and up. Default [0, 0].

offset?: Pixel | DataDrivenPropertyValueSpecification<Pixel>

Property Value

Pixel | DataDrivenPropertyValueSpecification<Pixel>

opacity

A number between 0 and 1 that indicates the opacity at which the text will be drawn. Default 1.

opacity?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

optional

Specifies if the text can be hidden if it is overlapped by another symbol. If true, icons will display without their corresponding text when the text collides wit other symbols and the icon does not. Default false.

optional?: boolean

Property Value

boolean

padding

Size of the additional area around the text bounding box used for detecting symbol collisions. Default 2.

padding?: number | PropertyValueSpecification<number>

Property Value

number | PropertyValueSpecification<number>

pitchAlignment

Specifies the orientation of the text when the map is pitched.

`"auto"`: Automatically matches the value of `rotationAlignment`.

`"map"`: The text is aligned to the plane of the map.

`"viewport"`: The text is aligned to the plane of the viewport.

Default: `"auto"`

pitchAlignment?: "auto" | "map" | "viewport"

Property Value

"auto" | "map" | "viewport"

radialOffset

Radial offset of text, in the direction of the symbol's anchor. Useful in combination with variableAnchor, which defaults to using the two-dimensional offset if present. Default: 0

radialOffset?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

rotation

The amount to rotate the text clockwise in degrees. Default 0

rotation?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

rotationAlignment

In combination with the placement property of the SymbolLayerOptions, specifies the rotation behavior of the individual glyphs forming the text.

`"auto"`: When the `placement` is set to `"point"`, this is equivalent to `"map"`. When the `placement` is set to `"line"` this is equivalent to `"map"`.

`"map"`: When the `placement` is set to `"point"`, aligns text east-west. When the `placement` is set to `"line"`, aligns text x-axes with the line.

`"viewport"`: Produces glyphs whose x-axes are aligned with the x-axis of the viewport, regardless of the value of `placement`.

Default: `"auto"`

rotationAlignment?: "auto" | "map" | "viewport"

Property Value

"auto" | "map" | "viewport"

size

The size of the font in pixels. Must be a number greater or equal to 0. Default 16.

size?: number | DataDrivenPropertyValueSpecification<number>

Property Value

number | DataDrivenPropertyValueSpecification<number>

textField

Specifies the name of a property on the features to use for a text label.

textField?: string | DataDrivenPropertyValueSpecification<string>

Property Value

string | DataDrivenPropertyValueSpecification<string>

variableAnchor

List of potential anchor locations, to increase the chance of placing high-priority labels on the map. The renderer will attempt to place the label at each location, in order, before moving onto the next label. Use justify: "auto" to choose text justification based on anchor position. To apply an offset use the radialOffset or two-dimensional offset options.