> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/mapbox-gl-js/ja/llms.txt)

# User interaction handlers

Items related to the ways in which the map responds to user input.

## BoxZoomHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/box_zoom.ts#L15-L178)

The `BoxZoomHandler` allows the user to zoom the map to fit within a bounding box. The bounding box is defined by clicking and holding `shift` while dragging the cursor.

### Instance Members

#### isEnabled()

Returns a Boolean indicating whether the "box zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "box zoom" interaction is enabled.

##### Example

```js
const isBoxZoomEnabled = map.boxZoom.isEnabled();
```

#### isActive()

Returns a Boolean indicating whether the "box zoom" interaction is active (currently being used).

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "box zoom" interaction is active.

##### Example

```js
const isBoxZoomActive = map.boxZoom.isActive();
```

#### enable()

Enables the "box zoom" interaction.

##### Example

```js
map.boxZoom.enable();
```

#### disable()

Disables the "box zoom" interaction.

##### Example

```js
map.boxZoom.disable();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)
-   [Example: Highlight features within a bounding box](https://docs.mapbox.com/mapbox-gl-js/example/using-box-queryrenderedfeatures/)

## DoubleClickZoomHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/shim/dblclick_zoom.ts#L10-L66)

The `DoubleClickZoomHandler` allows the user to zoom the map at a point by double clicking or double tapping.

### Instance Members

#### enable()

Enables the "double click to zoom" interaction.

##### Example

```js
map.doubleClickZoom.enable();
```

#### disable()

Disables the "double click to zoom" interaction.

##### Example

```js
map.doubleClickZoom.disable();
```

#### isEnabled()

Returns a Boolean indicating whether the "double click to zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "double click to zoom" interaction is enabled.

##### Example

```js
const isDoubleClickZoomEnabled = map.doubleClickZoom.isEnabled();
```

#### isActive()

Returns a Boolean indicating whether the "double click to zoom" interaction is active (currently being used).

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "double click to zoom" interaction is active.

##### Example

```js
const isDoubleClickZoomActive = map.doubleClickZoom.isActive();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)

## DragPanHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/shim/drag_pan.ts#L18-L94)

The `DragPanHandler` allows the user to pan the map by clicking and dragging the cursor.

### Instance Members

#### enable()

Enables the "drag to pan" interaction and accepts options to control the behavior of the panning inertia.

##### Parameters

| Name | Description |
| --- | --- |
| **options** [Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)?  | Options object. |
| **options.deceleration** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) (default `2500`) | The rate at which the speed reduces after the pan ends. |
| **options.easing** [Function](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function)?  | Optional easing function applied to [Map#panTo](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#panto) when applying the drag. Defaults to bezier function using [@mapbox/unitbezier](https://github.com/mapbox/unitbezier) . |
| **options.linearity** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) (default `0`) | Factor used to scale the drag velocity. |
| **options.maxSpeed** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) (default `1400`) | The maximum value of the drag velocity. |

##### Example

```js
map.dragPan.enable();
```

```js
map.dragPan.enable({
    linearity: 0.3,
    easing: t => t,
    maxSpeed: 1400,
    deceleration: 2500
});
```

##### Related

-   [Example: Highlight features within a bounding box](https://docs.mapbox.com/mapbox-gl-js/example/using-box-queryrenderedfeatures/)

#### disable()

Disables the "drag to pan" interaction.

##### Example

```js
map.dragPan.disable();
```

#### isEnabled()

Returns a Boolean indicating whether the "drag to pan" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "drag to pan" interaction is enabled.

##### Example

```js
const isDragPanEnabled = map.dragPan.isEnabled();
```

#### isActive()

Returns a Boolean indicating whether the "drag to pan" interaction is active (currently being used).

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "drag to pan" interaction is active.

##### Example

```js
const isDragPanActive = map.dragPan.isActive();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)
-   [Example: Highlight features within a bounding box](https://docs.mapbox.com/mapbox-gl-js/example/using-box-queryrenderedfeatures/)

## DragRotateHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/shim/drag_rotate.ts#L10-L155)

The `DragRotateHandler` allows the user to rotate the map by clicking and dragging the cursor while holding the right mouse button or `ctrl` key.

### Instance Members

#### enable()

Enables the "drag to rotate" interaction.

##### Example

```js
map.dragRotate.enable();
```

#### disable()

Disables the "drag to rotate" interaction.

##### Example

```js
map.dragRotate.disable();
```

#### isEnabled()

Returns a Boolean indicating whether the "drag to rotate" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "drag to rotate" interaction is enabled.

##### Example

```js
const isDragRotateEnabled = map.dragRotate.isEnabled();
```

#### isActive()

Returns a Boolean indicating whether the "drag to rotate" interaction is active (currently being used).

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): Returns `true` if the "drag to rotate" interaction is active.

##### Example

```js
const isDragRotateActive = map.dragRotate.isActive();
```

#### disablePitch()

Disables the "drag to pitch" interaction, leaving the "drag to rotate" interaction enabled.

##### Example

```js
map.dragRotate.disablePitch();
```

#### enablePitch()

Enables the "drag to pitch" interaction.

Has no effect if the handler was constructed with `pitchWithRotate: false`, or if the parent "drag to rotate" interaction is currently disabled.

##### Example

```js
map.dragRotate.enablePitch();
```

#### isPitchEnabled()

Returns a Boolean indicating whether the "drag to pitch" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "drag to pitch" interaction is enabled.

##### Example

```js
const isDragPitchEnabled = map.dragRotate.isPitchEnabled();
```

#### disableRotation()

Disables the "drag to rotate" interaction, leaving the "drag to pitch" interaction enabled.

##### Example

```js
map.dragRotate.disableRotation();
```

#### enableRotation()

Enables the "drag to rotate" interaction.

##### Example

```js
map.dragRotate.enableRotation();
```

#### isRotationEnabled()

Returns a Boolean indicating whether the "drag to rotate" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "drag to rotate" interaction is enabled.

##### Example

```js
const isDragRotationEnabled = map.dragRotate.isRotationEnabled();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)
-   [Example: Disable map rotation](https://docs.mapbox.com/mapbox-gl-js/example/disable-rotation/)

## FeaturesetDescriptor

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/util/vectortile_to_geojson.ts#L82-L84)

`FeaturesetDescriptor` references a featureset in a style. If `importId` is not specified, the featureset is assumed to be in the root style.

### Type

{featuresetId: [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String), importId: [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?}

### Properties

| Name | Description |
| --- | --- |
| **featuresetId** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)  |  |
| **importId** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?  |  |

## Interaction

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/interactions.ts#L16-L19)

`Interaction` is a configuration object used with [Map#addInteraction](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#addinteraction) to handle user events, such as clicks and hovers. Interactions can be applied globally or to specific targets, such as layers or featuresets.

### Type

{type: MapInteractionEventType, target: [TargetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetdescriptor)?, namespace: [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?, filter: FilterSpecification?, handler: function (event: [InteractionEvent](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interactionevent)): ([boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| void)}

### Properties

| Name | Description |
| --- | --- |
| **filter** FilterSpecification?  |  |
| **handler** function (event: [InteractionEvent](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interactionevent)): ([boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| void)  |  |
| **namespace** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?  |  |
| **target** [TargetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetdescriptor)?  |  |
| **type** MapInteractionEventType  |  |

### Static Members

#### type

A type of interaction. For a full list of available events, see [Interaction `Map` events](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#events-interaction).

##### Type

MapInteractionEventType

#### target

A query target to add interaction to. This could be a [style layer ID](https://docs.mapbox.com/mapbox-gl-js/style-spec/#layer-id) or a [FeaturesetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#featuresetdescriptor).

##### Type

[TargetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetdescriptor)

#### namespace

A feature namespace to distinguish between features in the same sources but different featureset selectors.

##### Type

[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)

#### filter

A filter allows to specify which features from the query target should handle the interaction. This parameter only applies when the `target` is specified.

##### Type

FilterSpecification

#### handler

A function that will be called when the interaction is triggered.

##### Parameters

| Name | Description |
| --- | --- |
| **event** [InteractionEvent](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interactionevent)  | The event object. |

##### Type

function (event: [InteractionEvent](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interactionevent)): ([boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean) \| void)

## InteractionEvent

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/interactions.ts#L54-L93)

`InteractionEvent` is an event object that is passed to the interaction handler.

Extends [Event](https://developer.mozilla.org/docs/Web/API/Event).

### Instance Members

#### preventDefault

Prevents the event propagation to the next interaction in the stack.

##### Type

function (): void

#### id

The ID of the associated [Interaction](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interaction).

##### Type

[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)

#### interaction

The [Interaction](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interaction) configuration object.

##### Type

[Interaction](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#interaction)

#### feature

The [TargetFeature](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetfeature) associated with the interaction event triggered during the interaction handler execution.

##### Type

[TargetFeature](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetfeature)

## KeyboardHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/keyboard.ts#L28-L379)

The `KeyboardHandler` allows the user to zoom, rotate, and pan the map using the following keyboard shortcuts:

-   `=` / `+`: Increase the zoom level by 1.
-   `Shift-=` / `Shift-+`: Increase the zoom level by 2.
-   `-`: Decrease the zoom level by 1.
-   `Shift--`: Decrease the zoom level by 2.
-   Arrow keys: Pan by 100 pixels.
-   `Shift+⇢`: Increase the rotation by 15 degrees.
-   `Shift+⇠`: Decrease the rotation by 15 degrees.
-   `Shift+⇡`: Increase the pitch by 10 degrees.
-   `Shift+⇣`: Decrease the pitch by 10 degrees.

### Instance Members

#### enable()

Enables the "keyboard rotate and zoom" interaction.

##### Example

```js
map.keyboard.enable();
```

#### disable()

Disables the "keyboard rotate and zoom" interaction.

##### Example

```js
map.keyboard.disable();
```

#### isEnabled()

Returns a Boolean indicating whether the "keyboard rotate and zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard rotate and zoom" interaction is enabled.

##### Example

```js
const isKeyboardEnabled = map.keyboard.isEnabled();
```

#### isActive()

Returns true if the handler is enabled and has detected the start of a zoom/rotate gesture.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the handler is enabled and has detected the start of a zoom/rotate gesture.

##### Example

```js
const isKeyboardActive = map.keyboard.isActive();
```

#### disableRotation()

Disables the "keyboard pitch/rotate" interaction, leaving the "keyboard zoom" interaction enabled.

##### Example

```js
map.keyboard.disableRotation();
```

#### enableRotation()

Enables the "keyboard pitch/rotate" interaction.

##### Example

```js
map.keyboard.enable();
map.keyboard.enableRotation();
```

#### isRotationEnabled()

Returns a Boolean indicating whether the "keyboard pitch/rotate" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard pitch/rotate" interaction is enabled.

##### Example

```js
const isRotationEnabled = map.keyboard.isRotationEnabled();
```

#### disablePan()

Disables the "keyboard pan" interaction (arrow keys), leaving the "keyboard zoom" and "keyboard rotate/pitch" interactions enabled.

##### Example

```js
map.keyboard.disablePan();
```

#### enablePan()

Enables the "keyboard pan" interaction (arrow keys).

##### Example

```js
map.keyboard.enable();
map.keyboard.enablePan();
```

#### isPanEnabled()

Returns a Boolean indicating whether the "keyboard pan" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard pan" interaction is enabled.

##### Example

```js
const isPanEnabled = map.keyboard.isPanEnabled();
```

#### disableZoom()

Disables the "keyboard zoom" interaction (plus/minus keys), leaving the "keyboard pan" and "keyboard rotate/pitch" interactions enabled.

##### Example

```js
map.keyboard.disableZoom();
```

#### enableZoom()

Enables the "keyboard zoom" interaction (plus/minus keys).

##### Example

```js
map.keyboard.enable();
map.keyboard.enableZoom();
```

#### isZoomEnabled()

Returns a Boolean indicating whether the "keyboard zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard zoom" interaction is enabled.

##### Example

```js
const isZoomEnabled = map.keyboard.isZoomEnabled();
```

#### disablePitch()

Disables the "keyboard pitch" interaction (Shift+Up/Down), leaving the "keyboard pan" and "keyboard rotate" interactions enabled.

##### Example

```js
map.keyboard.disablePitch();
```

#### enablePitch()

Enables the "keyboard pitch" interaction (Shift+Up/Down).

##### Example

```js
map.keyboard.enable();
map.keyboard.enablePitch();
```

#### isPitchEnabled()

Returns a Boolean indicating whether the "keyboard pitch" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard pitch" interaction is enabled.

##### Example

```js
const isPitchEnabled = map.keyboard.isPitchEnabled();
```

#### disableBearing()

Disables the "keyboard bearing" interaction (Shift+Left/Right), leaving the "keyboard pan" and "keyboard pitch" interactions enabled.

##### Example

```js
map.keyboard.disableBearing();
```

#### enableBearing()

Enables the "keyboard bearing" interaction (Shift+Left/Right).

##### Example

```js
map.keyboard.enable();
map.keyboard.enableBearing();
```

#### isBearingEnabled()

Returns a Boolean indicating whether the "keyboard bearing" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "keyboard bearing" interaction is enabled.

##### Example

```js
const isBearingEnabled = map.keyboard.isBearingEnabled();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)
-   [Example: Navigate the map with game-like controls](https://docs.mapbox.com/mapbox-gl-js/example/game-controls/)
-   [Example: Display map navigation controls](https://docs.mapbox.com/mapbox-gl-js/example/navigation/)

## ScrollZoomHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/scroll_zoom.ts#L37-L430)

The `ScrollZoomHandler` allows the user to zoom the map by scrolling.

### Instance Members

#### setZoomRate()

Sets the zoom rate of a trackpad.

##### Parameters

| Name | Description |
| --- | --- |
| **zoomRate** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) (default `1/100`) | The rate used to scale trackpad movement to a zoom value. |

##### Example

```js
// Speed up trackpad zoom
map.scrollZoom.setZoomRate(1 / 25);
```

#### setWheelZoomRate()

Sets the zoom rate of a mouse wheel.

##### Parameters

| Name | Description |
| --- | --- |
| **wheelZoomRate** [number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number) (default `1/450`) | The rate used to scale mouse wheel movement to a zoom value. |

##### Example

```js
// Slow down zoom of mouse wheel
map.scrollZoom.setWheelZoomRate(1 / 600);
```

#### isEnabled()

Returns a Boolean indicating whether the "scroll to zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "scroll to zoom" interaction is enabled.

##### Example

```js
const isScrollZoomEnabled = map.scrollZoom.isEnabled();
```

#### enable()

Enables the "scroll to zoom" interaction.

##### Parameters

| Name | Description |
| --- | --- |
| **options** [Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)?  | Options object. |
| **options.around** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?  | If "center" is passed, map will zoom around center of map. |

##### Example

```js
map.scrollZoom.enable();
```

```js
map.scrollZoom.enable({around: 'center'});
```

#### disable()

Disables the "scroll to zoom" interaction.

##### Example

```js
map.scrollZoom.disable();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)
-   [Example: Disable scroll zoom](https://docs.mapbox.com/mapbox-gl-js/example/disable-scroll-zoom/)

## TargetDescriptor

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/util/vectortile_to_geojson.ts#L87-L91)

`TargetDescriptor` defines the target for a [Map#queryRenderedFeatures](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#queryrenderedfeatures) query to inspect, referencing either a [style layer ID](https://docs.mapbox.com/mapbox-gl-js/style-spec/#layer-id) or a [FeaturesetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#featuresetdescriptor). It acts as a universal target for [Map#addInteraction](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#addinteraction) and [Map#queryRenderedFeatures](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#queryrenderedfeatures).

### Type

({layerId: [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)} \| [FeaturesetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#featuresetdescriptor))

## TargetFeature

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/util/vectortile_to_geojson.ts#L113-L152)

`TargetFeature` is a [GeoJSON](http://geojson.org/) [Feature object](https://tools.ietf.org/html/rfc7946#section-3.2) representing a feature associated with a specific query target in [Map#queryRenderedFeatures](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map#queryrenderedfeatures). For featuresets in imports, `TargetFeature` includes a `target` reference as a [TargetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetdescriptor) and may also include a `namespace` property to prevent feature ID collisions when layers defined in the query target reference multiple sources. Unlike features returned for root style featuresets, `TargetFeature` omits the `layer`, `source`, and `sourceLayer` properties if the feature belongs to import style.

Extends Feature.

### Instance Members

#### target

The target descriptor of the feature.

##### Type

[TargetDescriptor](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/handlers/#targetdescriptor)

#### namespace

The namespace of the feature.

##### Type

[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)

## TouchPitchHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/touch_zoom_rotate.ts#L210-L285)

The `TouchPitchHandler` allows the user to pitch the map by dragging up and down with two fingers.

Extends TwoTouchHandler.

> new TouchPitchHandler(map: <a href="/mapbox-gl-js/api/map/#map">Map</a>)

### Parameters

| Name | Description |
| --- | --- |
| **map** [Map](https://docs.mapbox.com/mapbox-gl-js/ja/mapbox-gl-js/api/map/#map)  |  |

### Related

-   [Example: Set pitch and bearing](https://docs.mapbox.com/mapbox-gl-js/example/set-perspective/)

## TouchZoomRotateHandler

[Source Code](https://github.com/mapbox/mapbox-gl-js/blob/2d7d5d25a4e2f8bc7fb778381e15764b97d4fc65/src/ui/handler/shim/touch_zoom_rotate.ts#L17-L166)

The `TouchZoomRotateHandler` allows the user to zoom and rotate the map by pinching on a touchscreen.

They can zoom with one finger by double tapping and dragging. On the second tap, hold the finger down and drag up or down to zoom in or out.

### Instance Members

#### enable()

Enables the "pinch to rotate and zoom" interaction.

##### Parameters

| Name | Description |
| --- | --- |
| **options** [Object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)?  | Options object. |
| **options.around** [string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?  | If "center" is passed, map will zoom around the center. |

##### Example

```js
map.touchZoomRotate.enable();
```

```js
map.touchZoomRotate.enable({around: 'center'});
```

#### disable()

Disables the "pinch to rotate and zoom" interaction.

##### Example

```js
map.touchZoomRotate.disable();
```

#### isEnabled()

Returns a Boolean indicating whether the "pinch to rotate and zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "pinch to rotate and zoom" interaction is enabled.

##### Example

```js
const isTouchZoomRotateEnabled = map.touchZoomRotate.isEnabled();
```

#### isActive()

Returns true if the handler is enabled and has detected the start of a zoom/rotate gesture.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if enabled and a zoom/rotate gesture was detected.

##### Example

```js
const isTouchZoomRotateActive = map.touchZoomRotate.isActive();
```

#### disableRotation()

Disables the "pinch to rotate" interaction, leaving the "pinch to zoom" interaction enabled.

##### Example

```js
map.touchZoomRotate.disableRotation();
```

#### enableRotation()

Enables the "pinch to rotate" interaction.

##### Example

```js
map.touchZoomRotate.enable();
map.touchZoomRotate.enableRotation();
```

#### isRotationEnabled()

Returns a Boolean indicating whether the "pinch to rotate" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "pinch to rotate" interaction is enabled.

##### Example

```js
const isRotationEnabled = map.touchZoomRotate.isRotationEnabled();
```

#### disableTapDragZoom()

Disables the "tap and drag to zoom" interaction (single-finger zoom by tapping, then on a second tap holding and dragging vertically), leaving pinch-zoom and pinch-rotate enabled. Useful on touchscreen-equipped desktops where the gesture can fire unintentionally from successive clicks.

##### Example

```js
map.touchZoomRotate.disableTapDragZoom();
```

#### enableTapDragZoom()

Enables the "tap and drag to zoom" interaction.

##### Example

```js
map.touchZoomRotate.enable();
map.touchZoomRotate.enableTapDragZoom();
```

#### isTapDragZoomEnabled()

Returns a Boolean indicating whether the "tap and drag to zoom" interaction is enabled.

##### Returns

[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean): `true` if the "tap and drag to zoom" interaction is enabled.

##### Example

```js
const isTapDragZoomEnabled = map.touchZoomRotate.isTapDragZoomEnabled();
```

### Related

-   [Example: Toggle interactions](https://docs.mapbox.com/mapbox-gl-js/example/toggle-interaction-handlers/)