TomTom Maps SDK for JavaScript
TomTom Maps for JavaScript
    Preparing search index...

    Type Alias PlaceDisplayProps

    PlaceDisplayProps: {
        category?: string;
        group?: string;
        iconID: string;
        id: string;
        title?: string;
    } & SupportsEvents & Anything

    Properties attached to a place feature for rendering on the map.

    Type Declaration

    • Optionalcategory?: string

      The base map style POI category to render the place as.

      Populated only for the base-map and pin-clustered marker types. Values are the lowercased IDs the base map style uses, derived with toBaseMapPOICategory. It drives the inherited text-color expression on the main and selected POI-like layers.

      category: 'restaurant'
      category: 'hotel_or_motel'
      category: 'charging_location'
    • Optionalgroup?: string

      The base map style POI group the place belongs to.

      Populated only for the base-map and pin-clustered marker types. It drives the inherited text-color expression on the base map's POI layers. Valid values are those toBaseMapPOIGroup produces, such as eat_and_drink, lodging, driving, transport, shopping, healthcare, finance, cultural, leisure, sport, outdoor, protected, public, religion, military, business, education, parking.

    • iconID: string

      The sprite image ID the place marker is drawn with.

      The main layer binds icon-image to ['get', 'iconID'], so the sprite named here is what renders. The base map's POI-Micro-like layer inherits the style's group-driven expression verbatim and ignores this value. The sprite name depends on the marker type:

      • pin and pin-clustered pick a POI category image of the pinCategories sprite, so its ID carries that sprite's namespace.
      • circle-icon and base-map pick the base map's poi-<category> image.
      • A custom PlaceIconConfig.categoryIcons entry overrides the default for the main layer on any marker type.
      iconID: 'pinCategories:7315' // pin sprite
      iconID: 'poi-restaurant'     // circle-icon / base-map sprite
      iconID: 'custom-marker-0'    // user-provided custom icon
    • id: string

      The unique ID of the place feature.

      MapLibre doesn't reuse the feature IDs, so the SDK either generates one on the fly or promotes properties.id with the source's promoteId option. It identifies the feature in events, hit-testing and data updates.

      id: 'place-123'
    • Optionaltitle?: string

      The text label rendered next to the place marker.

      If absent, no label is drawn. It usually comes from the POI name or free-form address, but can be any custom string, such as one from PlacesModuleConfig.label.title.

      title: 'Amsterdam Central Station'

    They extend the source place with display-only fields the places layer stack reads. Which fields are populated depends on the active marker type:

    • Every marker type uses iconID, the sprite name the main layer's icon-image expression binds to with ['get', 'iconID']. The base map's POI-Micro-like layer inherits the style's ['get','group'] expression verbatim, so custom PlaceIconConfig.categoryIcons sprites apply only to the main layer.
    • The base-map and pin-clustered marker types also populate category and group, so the base map style's own text-color expression and the POI-Micro layer's icon-image expression resolve against the place feature as they do for native POIs.
    • The pin-clustered marker type also populates baseMapIconID, the poi-<category> sprite of the place, which a single-category cluster is drawn with.
    const pinPlaceProps: PlaceDisplayProps = {
      id: 'place-123',
      title: 'Central Station',
      iconID: 'pinCategories:7380',
    };

    const baseMapPlaceProps: PlaceDisplayProps = {
      id: 'place-123',
      title: 'Central Station',
      iconID: 'poi-railway_station',
      category: 'railway_station',
      group: 'transport',
    };

    Settings
    Member Visibility