/

Labels layer API

This reference describes the labels layer API.

The labels layer draws short fragments of text at the specified 2d coordinates. You can define the color and opacity of each label. Additionally, you can draw boxes around specific labels:

dotAtlas labels layer.

You can create an example labels layer using the following code: 

const labels = DotAtlas.createLayer({
  points: [],
  type: "label",
  labelFontSize: 16,
  labelColor: "black"
});

See the following documentation for all the point and layer properties you can use.

Point properties

labelColor

The color of the label. If the color is not provided for a point, the layer-wide labelColor is used.

labelOpacity

The opacity of the label. If opacity is not provided for a point, the layer-wide labelOpacity is used.

labelOpacity

Controls the display of the labels at various zoom levels.

dotAtlas draws only those labels that do not overlap any other labels. This means that at a certain zoom level only a limited number of labels will show on the screen. As the zoom level increases, more labels located in the zoomed area will show.

To control which labels show first, set the labelPriorityof the point. If you provide label priorities, dotAtlas displays labels in the decreasing order of priority.

labelBoxColor

Color of the box to draw around the label. If not provided, the layer-wide labelBoxColor is assumed.

labelBoxOpacity

Opacity of the box to draw around the label. If not provided, the layer-wide labelBoxOpacity will be used.

Layer properties

labelColor

Layer-wide label color, rgba(0, 0, 0, 1.0) by default.

Labels for which the point-specific labelColor was not provided will be drawn in the color defined by this property.

labelOpacity

Layer-wide label opacity, 1.0 by default.

Labels for which the point-specific labelOpacity was not provided will be drawn with the opacity defined by this property.

labelBoxColor

Layer-wide label box color, hsla(40, 75%, 80%, 0.5) by default.

Labels for which the point-specific labelBoxColor was not provided will use the box color defined in this property.

labelBoxOpacity

Layer-wide label box opacity, 0.0 by default.

Labels for which the point-specific labelBoxOpacity was not provided will be drawn with the box opacity defined by this property. As a result, if you set this property to a non-zero value, all labels for which label box opacity was not overridden will be drawn inside boxes.

labelShadowColor

Color of the drop shadow to draw under all labels on this layer, transparent by default.

Drop shadows may be useful to increase the contrast between labels and other map elements, especially when the whole visualization is drawn in dark colors. Make sure to also set a non-zero

labelShadowOpacity

Opacity of label drop shadows on this layer, 0.0 by default.

labelFontSize

The font size to use to draw all labels on this layer, 16 by default. Only numeric value in pixels are accepted, CSS length specifications, such as 1em are not supported.

labelFontFamily

The font family to use to draw all labels on this layer, sans-serif by default. This property accepts CSS-compliant font family specification.

labelFontWeight

The font weight to use to draw all labels on this layer, normal by default. This property accepts CSS-compliant font weight definitions, such as bold or 300.

labelFontStyle

The font style to use to draw all labels on this layer, normal by default. This property accepts CSS-compliant font style definitions, such as italic.

labelFontVariant

The font variant to use to draw all labels on this layer, normal by default. This property accepts CSS-compliant font variant definitions, such as small-caps.