Class: Label

cercaliagl.Label


Javascript ES5

const label = new cercaliagl.Label({...});

This class is used to provide a floating overlay div HTML on Marker. This element is and DOM element, it is different than SimpleLabel which is rendered in canvas via webgl.

Example usage:

const label = new cercaliagl.Label({
  text: 'This is a label',
  className: 'cercalia-label-custom-class',
});
const marker = new cercaliagl.Marker({
  position: new cercaliagl.LonLat(1.412, 41.1),
  label: label,
});
map.addMarker(marker);

new Label(options)

Label.js, line 46
Name Type Description
options

Options

Name Type Description
className string

Class name for CSS styling. Default empty.
color string

Label color. Default value '#000000'
background string

Label backgroud. The string format is the same than css tag. Default value 'none repeat scroll 0% 0% #ffffff'
fontWeight boolean

Bold text. Default: false
offset module:maplibre-gl~Offset

Label offset, in pixels, from the bottom position of icon. Default value for default label is [-3, -18].
show boolean

Show text. Default value 1.
text string

Simple Label text (with no background).
anchor module:maplibre-gl~PositionAnchor | undefined

Anchor 'center' , 'top' , 'bottom' , 'left' , 'right' , 'top-left' , 'top-right'.

Methods

getElement(){Element}

Label.js, line 219

Return DOM Element.

getMarker(){module:cercaliagl/Marker~Marker}

Label.js, line 194

Obtain marker.

Returns:
Marker.

getText(){string}

Label.js, line 149

Obtain text

Returns:
Label text

hide()

Label.js, line 167

Hide element on map

isVisible(){boolean}

Label.js, line 177
Returns:
if popup is opened or not. Values: true or false.

setPosition(position)

Label.js, line 203

Change label position.

Name Type Description
position module:cercaliagl/LonLat~LonLat

Position

setText(text)

Label.js, line 139

Change label text content. It can be HTML string. For example <b>Bold</b> text label

Name Type Description
text string

Text to display on label.

show()

Label.js, line 157

Show element on map