This is the documentation of version 0.60.0. Go to the latest version, 1.0.0-rc.5.
TomTom Maps for JavaScript
    Preparing search index...

    Type Alias GeometryLabel

    GeometryLabel: LabelConfig & {
        text: DataDrivenPropertyValueSpecification<string>;
    }

    The label drawn at the center of each geometry: its text, and how it looks.

    Type Declaration

    • text: DataDrivenPropertyValueSpecification<string>

      Text content to display as label.

      Must be a MapLibre expression that evaluates to a string. Labels are positioned at the geometry's center point.

      // Display feature property
      text: ['get', 'name']

      // Concatenate properties
      text: ['concat', ['get', 'name'], ' (', ['get', 'area'], ' km²)']

      // Conditional text
      text: ['case', ['has', 'label'], ['get', 'label'], '']

    Unset styling fields keep the defaults: size 15, bold font, and theme-adaptive colours — '#333333' text with a '#FFFFFF' halo on light map styles, the reverse on dark.

    // Simple text
    const label: GeometryLabel = {
    text: ['get', 'name']
    };

    // Conditional text, larger and in white
    const conditionalLabel: GeometryLabel = {
    text: ['case', ['has', 'title'], ['get', 'title'], ['get', 'id']],
    size: 18,
    color: '#FFFFFF',
    haloColor: '#000000',
    };