Map class

Package:

azure-maps-control

The control for a visual and interactive web map.

Constructors

Map(string | HTMLElement, ServiceOptions & StyleOptions & UserInteractionOptions & (CameraOptions | CameraBoundsOptions))

Displays a map in the specified container.

Properties

authentication
controls
events
imageSprite
isDisposed	Returns true if the map has been disposed.
layers
markers
popups
sources

Methods

areTilesLoaded()	Returns a boolean indicating if all tiles in the current viewport for all sources have loaded or not.
clear()	Removes all sources, layers, markers, and popups from the map. User added images are preserved.
disableElevation()	Disables the 3D terrain mesh.
dispose()	Clean up the map's resources. Map will not function correctly after calling this method.
enableElevation(string | ElevationTileSource, number)	Loads a 3D terrain mesh, based on a "raster-dem" source.
getCamera()	Returns the camera's current properties.
getCanvas()	Returns the HTMLCanvasElement that the map is drawn to.
getCanvasContainer()	Returns the HTMLElement that contains the map's HTMLCanvasElement. The map's events (e.g. panning and zooming) are attached to this element.
getMapContainer()	Returns the HTMLElement that contains the map.
getServiceOptions()	Returns the service options with which the map control was initialized.
getStyle()	Returns the map control's current style settings.
getTraffic()	Return the map control's current traffic settings.
getUserInteraction()	Return the map control's current user interaction handler settings.
pixelsToPositions(Pixel[])	Converts an array of Pixel objects to an array of geographic Positions objects on the map.
positionsToPixels(Position[])	Converts an array of Positions objects to an array of Pixel objects relative to the map container.
resize(any)	Resize the map according to the dimensions of its container element.
resize(number | string, number | string, any)	Resizes the map's container element then the map itself.
setCamera((CameraOptions | (CameraBoundsOptions & { bearing?: number, pitch?: number })) & AnimationOptions)	Set the camera of the map control with an animated transition. Any options not specified will default to their current values.
setServiceOptions(ServiceOptions)	Set the service options.
setStyle(StyleOptions, boolean)	Set the map control's style options. Any options not specified will default to their current values.
setTraffic(TrafficOptions)	Set the traffic options for the map. Any options not specified will default to their current values.
setUserInteraction(UserInteractionOptions)	Set the map control's user interaction handlers. Any options not specified will default to their current values.
stop()	Stops any animated transition that is currently underway.
triggerRepaint()	Trigger the rendering of a single frame. Use this method with WebGL layers to repaint the map when the layer's properties or properties associated with the layer's source change. Calling this multiple times before the next frame is rendered will still result in only a single frame being rendered.

Constructor Details

Map(string | HTMLElement, ServiceOptions & StyleOptions & UserInteractionOptions & (CameraOptions | CameraBoundsOptions))

Displays a map in the specified container.

new Map(container: string | HTMLElement, options: ServiceOptions & StyleOptions & UserInteractionOptions & (CameraOptions | CameraBoundsOptions))

Parameters

container

string | HTMLElement

The id of the element where the map should be displayed.

options

ServiceOptions & StyleOptions & UserInteractionOptions & (CameraOptions | CameraBoundsOptions)

Options for the initial display and interactability with the map.

Property Details

authentication

authentication: AuthenticationManager

Property Value

AuthenticationManager

controls

controls: ControlManager

Property Value

ControlManager

events

events: EventManager

Property Value

EventManager

imageSprite

imageSprite: ImageSpriteManager

Property Value

ImageSpriteManager

isDisposed

Returns true if the map has been disposed.

boolean isDisposed

Property Value

boolean

layers

layers: LayerManager

Property Value

LayerManager

markers

markers: HtmlMarkerManager

Property Value

HtmlMarkerManager

popups

popups: PopupManager

Property Value

PopupManager

sources

sources: SourceManager

Property Value

SourceManager

Method Details

areTilesLoaded()

Returns a boolean indicating if all tiles in the current viewport for all sources have loaded or not.

function areTilesLoaded(): boolean

Returns

boolean

clear()

Removes all sources, layers, markers, and popups from the map. User added images are preserved.

function clear()

disableElevation()

Disables the 3D terrain mesh.

function disableElevation()

dispose()

Clean up the map's resources. Map will not function correctly after calling this method.

function dispose()

enableElevation(string | ElevationTileSource, number)

Loads a 3D terrain mesh, based on a "raster-dem" source.

function enableElevation(elevationSource: string | ElevationTileSource, exaggeration?: number)

Parameters

elevationSource

string | ElevationTileSource

elevation tile source

exaggeration

number

the elevation exaggeration factor

getCamera()

Returns the camera's current properties.

function getCamera(): CameraOptions & CameraBoundsOptions

Returns

CameraOptions & CameraBoundsOptions

getCanvas()

Returns the HTMLCanvasElement that the map is drawn to.

function getCanvas(): HTMLCanvasElement

Returns

HTMLCanvasElement

getCanvasContainer()

Returns the HTMLElement that contains the map's HTMLCanvasElement. The map's events (e.g. panning and zooming) are attached to this element.

function getCanvasContainer(): HTMLElement

Returns

HTMLElement

getMapContainer()

Returns the HTMLElement that contains the map.

function getMapContainer(): HTMLElement

Returns

HTMLElement

getServiceOptions()

Returns the service options with which the map control was initialized.

function getServiceOptions(): ServiceOptions

Returns

ServiceOptions

getStyle()

Returns the map control's current style settings.

function getStyle(): StyleOptions

Returns

StyleOptions

getTraffic()

Return the map control's current traffic settings.

function getTraffic(): TrafficOptions

Returns

TrafficOptions

getUserInteraction()

Return the map control's current user interaction handler settings.

function getUserInteraction(): UserInteractionOptions

Returns

UserInteractionOptions

pixelsToPositions(Pixel[])

Converts an array of Pixel objects to an array of geographic Positions objects on the map.

function pixelsToPositions(pixels: Pixel[]): Position[]

Parameters

pixels

Pixel[]

The pixels to be converted.

Returns

Position[]

positionsToPixels(Position[])

Converts an array of Positions objects to an array of Pixel objects relative to the map container.

function positionsToPixels(positions: Position[]): Pixel[]

Parameters

positions

Position[]

The positions to be converted.

Returns

Pixel[]

resize(any)

Resize the map according to the dimensions of its container element.

function resize(eventData?: any)

Parameters

eventData

any

Optional additional properties to be added to event objects of events triggered by this method.

resize(number | string, number | string, any)

Resizes the map's container element then the map itself.

function resize(height: number | string, width: number | string, eventData?: any)

Parameters

height

number | string

The height for the map and its container element. A number input is assumed to be in pixels.

width

number | string

The width for the map and its container element. A number input is assumed to be in pixels.

eventData

any

Optional additional properties to be added to event objects of events triggered by this method.

setCamera((CameraOptions | (CameraBoundsOptions & { bearing?: number, pitch?: number })) & AnimationOptions)

Set the camera of the map control with an animated transition. Any options not specified will default to their current values.

function setCamera(options?: (CameraOptions | (CameraBoundsOptions & { bearing?: number, pitch?: number })) & AnimationOptions)

Parameters

options

(CameraOptions | (CameraBoundsOptions & { bearing?: number, pitch?: number })) & AnimationOptions

The options for setting the map's camera and for the animation of any view change.

setServiceOptions(ServiceOptions)

Set the service options.

function setServiceOptions(options: ServiceOptions)

Parameters

options

ServiceOptions

setStyle(StyleOptions, boolean)

Set the map control's style options. Any options not specified will default to their current values.

function setStyle(options?: StyleOptions, diff?: boolean)

Parameters

options

StyleOptions

The options for setting the style of the map control.

diff

boolean

If false, forces a 'full' style update, removing the current style and building the given one instead of attempting a diff-based update. Defaults to true.

setTraffic(TrafficOptions)

Set the traffic options for the map. Any options not specified will default to their current values.

function setTraffic(options?: TrafficOptions)

Parameters

options

TrafficOptions

The options for defining the map's traffic display.

setUserInteraction(UserInteractionOptions)

Set the map control's user interaction handlers. Any options not specified will default to their current values.

function setUserInteraction(options?: UserInteractionOptions)

Parameters

options

UserInteractionOptions

The options for enabling/disabling the user interaction handlers.

stop()

Stops any animated transition that is currently underway.

function stop()

triggerRepaint()

Trigger the rendering of a single frame. Use this method with WebGL layers to repaint the map when the layer's properties or properties associated with the layer's source change. Calling this multiple times before the next frame is rendered will still result in only a single frame being rendered.

function triggerRepaint()