Nextbillion.ai | The Map Experience for Your Next Billion

BoxZoomHandler

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.

Constructor

Name
BoxZoomHandler	new BoxZoomHandler(map: Map, options: { clickTolerance: number }) Parameters map: Map options: { clickTolerance: number }

Name

BoxZoomHandler

new BoxZoomHandler(map: Map, options: { clickTolerance: number })

Parameters

map: Map
options: { clickTolerance: number }

Methods

Method
disable	disable() Return Value: void Disables the "box zoom" interaction.
enable	enable() Return Value: void Enables the "box zoom" interaction.
isActive	isActive() Return Value: boolean Returns a Boolean indicating whether the "box zoom" interaction is active, i.e. currently being used.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "box zoom" interaction is enabled.
keydown	keydown(e: KeyboardEvent) Parameters e: KeyboardEvent Return Value: void
mousedown	mousedown(e: MouseEvent, point: Point) Parameters e: MouseEvent point: Point Return Value: void
mousemoveWindow	mousemoveWindow(e: MouseEvent, point: Point) Parameters e: MouseEvent point: Point Return Value: void
mouseupWindow	mouseupWindow(e: MouseEvent, point: Point) Parameters e: MouseEvent point: Point Return Value: none
reset	reset() Return Value: void

ScrollZoomHandler

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

Constructor

Name
ScrollZoomHandler	new ScrollZoomHandler(map: Map, handler: HandlerManager) Parameters map: Map handler: HandlerManager

Name

ScrollZoomHandler

new ScrollZoomHandler(map: Map, handler: HandlerManager)

Parameters

map: Map
handler: HandlerManager

Methods

Method
disable	disable() Return Value: void Disables the "scroll to zoom" interaction.
enable	enable(options: any) Parameters options: any Return Value: void Enables the "scroll to zoom" interaction.
isActive	isActive() Return Value: boolean
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "scroll to zoom" interaction is enabled.
isZooming	isZooming() Return Value: boolean
renderFrame	renderFrame() Return Value: none
reset	reset() Return Value: void
setWheelZoomRate	setWheelZoomRate(wheelZoomRate: number) Parameters wheelZoomRate: number Return Value: void Set the zoom rate of a mouse wheel
setZoomRate	setZoomRate(zoomRate: number) Parameters zoomRate: number Return Value: void Set the zoom rate of a trackpad
wheel	wheel(e: WheelEvent) Parameters e: WheelEvent Return Value: void

DragPanHandler

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

Constructor

Name
DragPanHandler	new DragPanHandler(el: HTMLElement, mousePan: MousePanHandler, touchPan: default) Parameters el: HTMLElement mousePan: MousePanHandler touchPan: default

Name

DragPanHandler

new DragPanHandler(el: HTMLElement, mousePan: MousePanHandler, touchPan: default)

Parameters

el: HTMLElement
mousePan: MousePanHandler
touchPan: default

Methods

Method
disable	disable() Return Value: void Disables the "drag to pan" interaction.
enable	enable(options: DragPanOptions) Parameters options: DragPanOptions Return Value: void Enables the "drag to pan" interaction.
isActive	isActive() Return Value: boolean Returns a Boolean indicating whether the "drag to pan" interaction is active, i.e. currently being used.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "drag to pan" interaction is enabled.

DragRotateHandler

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

Constructor

Name
DragRotateHandler	new DragRotateHandler(options: { pitchWithRotate: boolean }, mouseRotate: MouseRotateHandler, mousePitch: MousePitchHandler) Parameters options: { pitchWithRotate: boolean } mouseRotate: MouseRotateHandler mousePitch: MousePitchHandler

Name

DragRotateHandler

new DragRotateHandler(options: { pitchWithRotate: boolean }, mouseRotate: MouseRotateHandler, mousePitch: MousePitchHandler)

Parameters

options: { pitchWithRotate: boolean }
mouseRotate: MouseRotateHandler
mousePitch: MousePitchHandler

Methods

Method
disable	disable() Return Value: void Disables the "drag to rotate" interaction.
enable	enable() Return Value: void Enables the "drag to rotate" interaction.
isActive	isActive() Return Value: boolean Returns a Boolean indicating whether the "drag to rotate" interaction is active, i.e. currently being used.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "drag to rotate" interaction is enabled.

KeyboardHandler

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.

Methods

Method
disable	disable() Return Value: void Disables the "keyboard rotate and zoom" interaction.
disableRotation	disableRotation() Return Value: void Disables the "keyboard pan/rotate" interaction, leaving the "keyboard zoom" interaction enabled.
enable	enable() Return Value: void Enables the "keyboard rotate and zoom" interaction.
enableRotation	enableRotation() Return Value: void Enables the "keyboard pan/rotate" interaction.
isActive	isActive() Return Value: boolean Returns true if the handler is enabled and has detected the start of a zoom/rotate gesture.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "keyboard rotate and zoom" interaction is enabled.
keydown	keydown(e: KeyboardEvent) Parameters e: KeyboardEvent Return Value: none
reset	reset() Return Value: void

DoubleClickZoomHandler

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

Constructor

Name
DoubleClickZoomHandler	new DoubleClickZoomHandler(clickZoom: default, TapZoom: default) Parameters clickZoom: default TapZoom: default

Name

DoubleClickZoomHandler

new DoubleClickZoomHandler(clickZoom: default, TapZoom: default)

Parameters

clickZoom: default
TapZoom: default

Methods

Method
disable	disable() Return Value: void Disables the "double click to zoom" interaction.
enable	enable() Return Value: void Enables the "double click to zoom" interaction.
isActive	isActive() Return Value: boolean Returns a Boolean indicating whether the "double click to zoom" interaction is active, i.e. currently being used.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "double click to zoom" interaction is enabled.

TouchZoomRotateHandler

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.

Constructor

Name
TouchZoomRotateHandler	new TouchZoomRotateHandler(el: HTMLElement, touchZoom: TouchZoomHandler, touchRotate: TouchRotateHandler, tapDragZoom: default) Parameters el: HTMLElement touchZoom: TouchZoomHandler touchRotate: TouchRotateHandler tapDragZoom: default

Name

TouchZoomRotateHandler

new TouchZoomRotateHandler(el: HTMLElement, touchZoom: TouchZoomHandler, touchRotate: TouchRotateHandler, tapDragZoom: default)

Parameters

el: HTMLElement
touchZoom: TouchZoomHandler
touchRotate: TouchRotateHandler
tapDragZoom: default

Methods

Method
disable	disable() Return Value: void Disables the "pinch to rotate and zoom" interaction.
disableRotation	disableRotation() Return Value: void Disables the "pinch to rotate" interaction, leaving the "pinch to zoom" interaction enabled.
enable	enable(options: { around: center }) Parameters options: { around: center } Return Value: void Enables the "pinch to rotate and zoom" interaction.
enableRotation	enableRotation() Return Value: void Enables the "pinch to rotate" interaction.
isActive	isActive() Return Value: boolean Returns true if the handler is enabled and has detected the start of a zoom/rotate gesture.
isEnabled	isEnabled() Return Value: boolean Returns a Boolean indicating whether the "pinch to rotate and zoom" interaction is enabled.

TouchPitchHandler

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

Constructor

Name
TouchPitchHandler	new TouchPitchHandler(map: Map) Parameters map: Map

Name

TouchPitchHandler

new TouchPitchHandler(map: Map)

Parameters

map: Map

Methods

Method
disable	disable() Return Value: void
enable	enable(options: { around: center }) Parameters options: { around: center } Return Value: void
gestureBeginsVertically	gestureBeginsVertically(vectorA: Point, vectorB: Point, timeStamp: number) Parameters vectorA: Point vectorB: Point timeStamp: number Return Value: none
isActive	isActive() Return Value: boolean
isEnabled	isEnabled() Return Value: boolean
reset	reset() Return Value: void
touchcancel	touchcancel() Return Value: void
touchend	touchend(e: TouchEvent, points: Array<Point>, mapTouches: Array<Touch>) Parameters e: TouchEvent points: Array<Point> mapTouches: Array<Touch> Return Value: void
touchmove	touchmove(e: TouchEvent, points: Array<Point>, mapTouches: Array<Touch>) Parameters e: TouchEvent points: Array<Point> mapTouches: Array<Touch> Return Value: none
touchstart	touchstart(e: TouchEvent, points: Array<Point>, mapTouches: Array<Touch>) Parameters e: TouchEvent points: Array<Point> mapTouches: Array<Touch> Return Value: void