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

    Type Alias PlacesClusterConfig

    Configuration for the pin-clustered theme.

    Ignored by every other PlacesTheme.

    const places = await PlacesModule.create(map, {
      theme: 'pin-clustered',
      cluster: {
        badge: { color: '#3f9cd9', radius: { single: 13, mixed: 18 } }
      }
    });
    type PlacesClusterConfig = {
        badge?: PlaceClusterBadgeConfig;
        source?: Omit<GeoJSONSourceClusterOptions, "cluster" | "clusterProperties"> & {
            clusterProperties?: Record<string, unknown>;
        };
    }
    Index
    badge? source?
    badge?: PlaceClusterBadgeConfig

    Appearance of the cluster count badge.

    source?: Omit<GeoJSONSourceClusterOptions, "cluster" | "clusterProperties"> & {
        clusterProperties?: Record<string, unknown>;
    }

    Clustering options forwarded verbatim to the underlying GeoJSON source.

    Type Declaration

    • OptionalclusterProperties?: Record<string, unknown>

      Aggregators keyed by the cluster property they produce. Each value is a [operator, mapExpression] pair (e.g. ['+', ['get', 'count']]) or the advanced [reduceExpression, mapExpression] form.

    • Changing them with PlacesModule.applyConfig recreates the places source.
    • cluster itself is not settable: theme: 'pin-clustered' switches clustering on.
    • clusterProperties land on each cluster feature's properties, for layer overrides to read with ['get', '<key>']. The key clusterBaseMapIconIDs is reserved for the module's own.
    const places = await PlacesModule.create(map, {
      theme: 'pin-clustered',
      cluster: {
        source: {
          clusterRadius: 100,
          clusterMaxZoom: 14,
          clusterMinPoints: 3,
          // Total charging points across the cluster
          clusterProperties: { connectors: ['+', ['get', 'connectorCount']] }
        },
      },
      layers: {
        clusterCount: { layout: { 'text-field': ['get', 'connectors'] } }
      }
    });

    { clusterRadius: 60, clusterMaxZoom: 17 }

    https://maplibre.org/maplibre-style-spec/sources/#cluster-properties

    Settings
    Member Visibility

    On This Page
    Properties