Type Alias LabelAppearance

Options to control how a label is rendered.

Option	Type	Description	Default
margin	number	Margin around the label text and pin in pixels. This will affect label density. Minimum is 6px.	6
maxLines	number	Number of lines to display when text spans multiple lines.	2
textSize	number	Text size in pixels	11.5
textPlacement	'top' | 'left' | 'right' | 'hidden' | ['top', 'left', 'right', 'hidden']	The placement of the text relative to the pin.	-
maxWidth	number	Maximum width of text in pixels.	150
lineHeight	number	Line height sets the height of a line box. It's commonly used to set the distance between lines of text.	1.2
color	ColorString	A ColorString for the label text and pin.	#333
outlineColor	ColorString	A ColorString for the outline around the label text and pin.	white
textColor	ColorString	A ColorString representing just the text color. Defaults to the same as color.	-
textOutlineColor	ColorString	A ColorString representing just the text outline. Defaults to the same as outlineColor.	-
pinColor	ColorString	A ColorString representing just the pin color. Defaults to the same as color.	-
pinOutlineColor	ColorString	A ColorString representing just the pin outline. Defaults to the same as outlineColor.	-
pinColorInactive	ColorString	A ColorString representing just the pin color when the label is inactive. Defaults to the same as pinColor.	-
pinOutlineColorInactive	ColorString	A ColorString representing just the pin outline when the label is inactive. Defaults to the same as pinOutlineColor.	-
icon	string	An icon to be placed inside the label pin. Can be an SVG string or a path to a PNG or JPEG.	-
iconSize	number	Size of the icon in pixels. Requires icon to be set.	20
iconScale	number | Interpolation	Scale the icon uniformly. Specify a number or an Interpolation object.	1
iconPadding	number	Padding between the icon and the pin's border in pixels.	2
iconFit	'fill' | 'contain' | 'cover'	How the icon should fit inside the pin. Options: fill (stretch to fill), cover (maintain aspect ratio and fill), contain (maintain aspect ratio and fit inside).	cover
iconOverflow	'visible' | 'hidden'	Whether the icon should overflow the circle of the pin. Options: visible, hidden.	hidden
iconVisible	boolean | number	Controls icon visibility. If boolean, directly shows/hides the icon. If number, defines the zoom level at which the icon becomes visible.	true
pinOpacity	number	The opacity of the pin when the Label is visible.	1

mapView.FloatingLabels.add(space, "Label", {
	appearance: {
		icon: `<svg>...</svg>`,
	},
});
Copy

mapView.FloatingLabels.add(space, "Label", {
	appearance: {
		icon: 'https://example.com/icon.png',
	},
});
Copy

mapView.FloatingLabels.add(space, "Label", {
	appearance: {
		// Make the icon 3x larger from zoom level 19 to 22
		iconScale: {
			on: 'zoom-level',
			input: [19, 22],
			output: [1, 3],
		},
	},
});
Copy