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

    Type Alias PlaceLabelConfig<P>

    PlaceLabelConfig: FeatureLabelConfig<Place<P>> & { distance?: number }

    The content, look and position of the labels next to place markers.

    Type Parameters

    Type Declaration

    • Optionaldistance?: number

      The distance of the text from the icon, in ems.

      It applies uniformly to all anchor positions (top, left, right).

      undefined (uses automatic offset calculation based on icon size)
      
      distance: 1.5  // Position text 1.5em away from icon in whichever direction the renderer chooses
      

    An unset LabelConfig field keeps the marker type's own label. Under base-map, that is the map style's POI labels. Otherwise, it is fully opaque #333333 text on a #FFFFFF halo (the reverse on a dark map), 14 to 16 pixels with a 1 to 1.5 pixel halo as the zoom grows. The label of a hovered or clicked place takes PlacesModuleConfig.color instead.

    Set labels here rather than with MapLibre's setPaintProperty / setLayoutProperty on the module's layers. A style change and a marker type change rebuild those layers from this config and drop anything written on them directly. MapLibre has no equivalent of title as a function of the place.

    // Simple text from place name
    const label: PlaceLabelConfig = {
    title: (place) => place.properties.poi?.name || place.properties.address.freeformAddress
    };

    // Using MapLibre expression with styling
    const styledLabel: PlaceLabelConfig = {
    title: ['get', 'title'],
    size: 14,
    color: '#333',
    haloColor: '#fff',
    haloWidth: 2
    };