--- title: "FillExtrusionLayerSpecification | 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 FillExtrusionLayerSpecification type FillExtrusionLayerSpecification \= {     [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)?: {         "fill-extrusion-base"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/);         "fill-extrusion-base-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-color"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<             [ColorSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ColorSpecification/),         \>;         "fill-extrusion-color-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-height"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/);         "fill-extrusion-height-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-opacity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/);         "fill-extrusion-opacity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-pattern"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<             [ResolvedImageSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ResolvedImageSpecification/),         \>;         "fill-extrusion-pattern-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-translate"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<\[number, number\]\>;         "fill-extrusion-translate-anchor"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<             "map"             | "viewport",         \>;         "fill-extrusion-translate-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);         "fill-extrusion-vertical-gradient"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/);     };     [source](#source): string;     ["source-layer"](#source-layer)?: string;     [type](#type): "fill-extrusion"; } ##### 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?: {     "fill-extrusion-base"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/);     "fill-extrusion-base-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-color"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<         [ColorSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ColorSpecification/),     \>;     "fill-extrusion-color-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-height"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/);     "fill-extrusion-height-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-opacity"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/);     "fill-extrusion-opacity-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-pattern"?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<         [ResolvedImageSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ResolvedImageSpecification/),     \>;     "fill-extrusion-pattern-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-translate"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<\[number, number\]\>;     "fill-extrusion-translate-anchor"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<         "map"         | "viewport",     \>;     "fill-extrusion-translate-transition"?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/);     "fill-extrusion-vertical-gradient"?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/); } Default paint properties for this layer. #### Type Declaration - ##### `Optional`fill-extrusion-base?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/) The height with which to extrude the base of this layer. Must be less than or equal to `fill-extrusion-height`. - ##### `Optional`fill-extrusion-base-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-color?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<[ColorSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ColorSpecification/)\> The base color of the extruded fill. The extrusion's surfaces will be shaded differently based on this color in combination with the root `light` settings. If this color is specified as `rgba` with an alpha component, the alpha component will be ignored; use `fill-extrusion-opacity` to set layer opacity. #### Default[](#default-1) ```typescript "#000000" ``` - ##### `Optional`fill-extrusion-color-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-height?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/) The height with which to extrude this layer. - ##### `Optional`fill-extrusion-height-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-opacity?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/) The opacity of the entire fill extrusion layer. This is rendered on a per-layer, not per-feature, basis, and data-driven styling is not available. #### Default[](#default-2) ```typescript 1 ``` - ##### `Optional`fill-extrusion-opacity-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-pattern?: [DataDrivenPropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/DataDrivenPropertyValueSpecification/)<[ResolvedImageSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/ResolvedImageSpecification/)\> Name of image in sprite to use for drawing images on extruded fills. For seamless patterns, image width and height must be a factor of two (2, 4, 8, ..., 512). Note that zoom-dependent expressions will be evaluated only at integer zoom levels. - ##### `Optional`fill-extrusion-pattern-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-translate?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<\[number, number\]\> The geometry's offset. Values are `[x, y]` where negatives indicate left and up (on the flat plane), respectively. #### Default[](#default-3) ```json [0, 0] ``` - ##### `Optional`fill-extrusion-translate-anchor?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/)<"map" | "viewport"\> Controls the frame of reference for `fill-extrusion-translate`. #### Default[](#default-4) ```typescript "map" ``` - ##### `Optional`fill-extrusion-translate-transition?: [TransitionSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TransitionSpecification/) - ##### `Optional`fill-extrusion-vertical-gradient?: [PropertyValueSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/PropertyValueSpecification/) Whether to apply a vertical gradient to the sides of a fill-extrusion layer. If true, sides will be shaded slightly darker farther down. #### Default[](#default-5) ```typescript true ``` ### 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: "fill-extrusion"