TomTom Maps for JavaScript
    Preparing search index...

    Type Alias GeometryFillConfig

    Fill configuration for geometry styling — the interior color, opacity, and (optionally) where the fill layer sits in the map's layer stack.

    // Solid color with opacity
    const fill: GeometryFillConfig = { color: '#FF5733', opacity: 0.3 };

    // Palette name
    const fill: GeometryFillConfig = { color: 'red', opacity: 0.25 };

    // Data-driven color based on properties
    const fill: GeometryFillConfig = {
    color: ['match', ['get', 'type'], 'residential', '#FFEB3B', 'commercial', '#2196F3', '#E0E0E0'],
    opacity: 0.4,
    };
    type GeometryFillConfig = {
        beforeLayerConfig?: BeforeLayerConfig;
        color?: ColorPaletteOptions | DataDrivenPropertyValueSpecification<string>;
        opacity?: DataDrivenPropertyValueSpecification<number>;
    }
    Index

    Properties

    beforeLayerConfig?: BeforeLayerConfig

    Layer positioning for the fill layer only.

    Overrides the top-level GeometriesModuleConfig.beforeLayerConfig for the fill. Use this to sink the fill below the road network while the border stays above, e.g. fill: { beforeLayerConfig: 'lowestRoadLine' }, line: { beforeLayerConfig: 'top' }.

    color?: ColorPaletteOptions | DataDrivenPropertyValueSpecification<string>

    Fill color: a hex string ('#FF5733'), a palette name ('red'), or a MapLibre expression for data-driven styling (e.g. ['get', 'color']).

    '#0A3653'
    
    opacity?: DataDrivenPropertyValueSpecification<number>

    Fill opacity, 0 (transparent) to 1 (opaque). Also accepts a MapLibre expression.

    0.15