---
title: "TerrainControl | 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.

# Class TerrainControl`Maptiler`

A `TerrainControl` control contains a button for turning the terrain on and off.

#### Example[](#example)

```typescript
let map = new Map({TerrainControl: false})
    .addControl(new TerrainControl({
        source: "terrain"
    }));
```

#### See[](#see)

-   [3D Terrain](https://maplibre.org/maplibre-gl-js/docs/examples/3d-terrain/)
-   [Create a Heatmap layer on a globe with terrain elevation](https://maplibre.org/maplibre-gl-js/docs/examples/create-a-heatmap-layer-on-a-globe-with-terrain-elevation/)
-   [Display a hybrid satellite map with terrain elevation](https://maplibre.org/maplibre-gl-js/docs/examples/display-a-hybrid-satellite-map-with-terrain-elevation/)
-   [Sky, Fog, Terrain](https://maplibre.org/maplibre-gl-js/docs/examples/sky-fog-terrain/)

#### Hierarchy ([View Summary](https://docs.maptiler.com/sdk-js/api-reference/hierarchy/#TerrainControl))

-   [TerrainControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/)
    -   TerrainControl

##### Index

### Constructors[](#constructors)

[constructor](#constructor)

### Properties[](#properties)

[options](#options)

### Methods[](#methods)

[onAdd](#onadd) [onRemove](#onremove)

## Constructors[](#constructors-1)

### constructor[](#constructor)

-   new TerrainControl(options: [TerrainSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TerrainSpecification/)): TerrainControl[](#constructorterraincontrol)
    
    #### Parameters
    
    -   options: [TerrainSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TerrainSpecification/)
        
        the control's options
        
    
    #### Returns TerrainControl
    
    Inherited from [TerrainControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/).[constructor](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/#constructor)
    

## Properties[](#properties-1)

### options[](#options)

options: [TerrainSpecification](https://docs.maptiler.com/sdk-js/api-reference/types/TerrainSpecification/)

Inherited from [TerrainControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/).[options](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/#options)

## Methods[](#methods-1)

### `Maptiler`onAdd[](#onadd)

-   onAdd(map: [MapLibreMap](https://docs.maptiler.com/sdk-js/api-reference/classes/MapLibreMap/) | [Map](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/)): [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/)[](#onadd-1)
    
    Register a control on the map and give it a chance to register event listeners and resources. This method is called by [Map.addControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/#addcontrol) internally.
    
    #### Parameters
    
    -   map: [MapLibreMap](https://docs.maptiler.com/sdk-js/api-reference/classes/MapLibreMap/) | [Map](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/)
        
        the Map this control will be added to
        
    
    #### Returns [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/)
    
    The control's container element. This should be created by the control and returned by onAdd without being attached to the DOM: the map will insert the control's element into the DOM as necessary.
    
    Overrides [TerrainControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/).[onAdd](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/#onadd)
    

### onRemove[](#onremove)

-   onRemove(): void[](#onremove-1)
    
    Unregister a control on the map and give it a chance to detach event listeners and resources. This method is called by [Map.removeControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/#removecontrol) internally.
    
    #### Returns void
    
    Inherited from [TerrainControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/).[onRemove](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TerrainControl/#onremove)