---
title: "HeatmapLayerSpecification | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Type Alias HeatmapLayerSpecification

type HeatmapLayerSpecification \= {  
    [filter](#filter)?: [FilterSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/FilterSpecification/);  
    [id](#id): string;  
    [layout](#layout)?: { visibility?: [VisibilitySpecification](https://docs.maptiler.com/sdk-js/api-reference/types/VisibilitySpecification/) };  
    [maxzoom](#maxzoom)?: number;  
    [metadata](#metadata)?: unknown;  
    [minzoom](#minzoom)?: number;  
    [paint](#paint)?: {  
        "heatmap-color"?: [ExpressionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ExpressionSpecification/);  
        "heatmap-intensity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>;  
        "heatmap-intensity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
        "heatmap-opacity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>;  
        "heatmap-opacity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
        "heatmap-radius"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>;  
        "heatmap-radius-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
        "heatmap-weight"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>;  
    };  
    [source](#source): string;  
    ["source-layer"](#source-layer)?: string;  
    [type](#type): "heatmap";  
}

##### Index

### Properties[](#properties)

[filter?](#filter) [id](#id) [layout?](#layout) [maxzoom?](#maxzoom) [metadata?](#metadata) [minzoom?](#minzoom) [paint?](#paint) [source](#source) [source-layer?](#source-layer) [type](#type)

## Properties[](#properties-1)

### `Optional`filter[](#filter)

filter?: [FilterSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/FilterSpecification/)

A expression specifying conditions on source features. Only features that match the filter are displayed. Zoom expressions in filters are only evaluated at integer zoom levels. The `feature-state` expression is not supported in filter expressions.

### id[](#id)

id: string

Unique layer name.

### `Optional`layout[](#layout)

layout?: { visibility?: [VisibilitySpecification](https://docs.maptiler.com/sdk-js/api-reference/types/VisibilitySpecification/) }

Layout properties for the layer.

#### Type Declaration

-   ##### `Optional`visibility?: [VisibilitySpecification](https://docs.maptiler.com/sdk-js/api-reference/types/VisibilitySpecification/)
    
    Whether this layer is displayed.
    
    #### Default[](#default)
    
    ```typescript
    "visible"
    ```
    

### `Optional`maxzoom[](#maxzoom)

maxzoom?: number

The maximum zoom level for the layer. At zoom levels equal to or greater than the maxzoom, the layer will be hidden.

### `Optional`metadata[](#metadata)

metadata?: unknown

Arbitrary properties useful to track with the layer, but do not influence rendering. Properties should be prefixed to avoid collisions, like 'maplibre:'.

#### Example[](#example)

```json
{"source:comment": "Hydrology FCCODE 460 - Narrow wash"}
```

### `Optional`minzoom[](#minzoom)

minzoom?: number

The minimum zoom level for the layer. At zoom levels less than the minzoom, the layer will be hidden.

### `Optional`paint[](#paint)

paint?: {  
    "heatmap-color"?: [ExpressionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ExpressionSpecification/);  
    "heatmap-intensity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>;  
    "heatmap-intensity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
    "heatmap-opacity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>;  
    "heatmap-opacity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
    "heatmap-radius"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>;  
    "heatmap-radius-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);  
    "heatmap-weight"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>;  
}

Default paint properties for this layer.

#### Type Declaration

-   ##### `Optional`heatmap-color?: [ExpressionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ExpressionSpecification/)
    
    Defines the color of each pixel based on its density value in a heatmap. Should be an expression that uses `["heatmap-density"]` as input.
    
    #### Default[](#default-1)
    
    ```json
    [
        "interpolate",
        ["linear"],
        ["heatmap-density"],
        0,
        "rgba(0, 0, 255, 0)",
        0.1,
        "royalblue",
        0.3,
        "cyan",
        0.5,
        "lime",
        0.7,
        "yellow",
        1,
        "red"
    ]
    ```
    
-   ##### `Optional`heatmap-intensity?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>
    
    Similar to `heatmap-weight` but controls the intensity of the heatmap globally. Primarily used for adjusting the heatmap based on zoom level.
    
    #### Default[](#default-2)
    
    ```typescript
    1
    ```
    
-   ##### `Optional`heatmap-intensity-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/)
    
-   ##### `Optional`heatmap-opacity?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<number\>
    
    The global opacity at which the heatmap layer will be drawn.
    
    #### Default[](#default-3)
    
    ```typescript
    1
    ```
    
-   ##### `Optional`heatmap-opacity-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/)
    
-   ##### `Optional`heatmap-radius?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>
    
    Radius of influence of one heatmap point in pixels. Increasing the value makes the heatmap smoother, but less detailed.
    
    #### Default[](#default-4)
    
    ```typescript
    30
    ```
    
-   ##### `Optional`heatmap-radius-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/)
    
-   ##### `Optional`heatmap-weight?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<number\>
    
    A measure of how much an individual point contributes to the heatmap. A value of 10 would be equivalent to having 10 points of weight 1 in the same spot. Especially useful when combined with clustering.
    
    #### Default[](#default-5)
    
    ```typescript
    1
    ```
    

### source[](#source)

source: string

Name of a source description to be used for this layer. Required for all layer types except `background`.

### `Optional`source-layer[](#source-layer)

"source-layer"?: string

Layer to use from a vector tile source. Required for vector tile sources; prohibited for all other source types, including GeoJSON sources.

### type[](#type)

type: "heatmap"