Class: Map

.xyz.maps. Map

new Map(mapElement, config)

XYZ Map is a map display with support for dynamically changing vector data.
Parameters:
Name Type Description
mapElement Element HTML element
config here.xyz.maps.Map.Config
Example:
//create Map display
 var display = new  here.xyz.maps.Map( mapDiv, {
     zoomLevel : 19,
     center: {
         latitude: 50.10905256955773, longitude: 8.657339975607162
     },
     // add layers to display
     layers: layers
 });

Classes

Config

Methods Summary

addEventListener(type, callback)

Adds an event listener.
supported events: 'mapviewchangestart', 'mapviewchange', 'mapviewchangeend', 'resize',
'tap', 'dbltap', 'pointerup', 'pointerenter', 'pointerleave', 'pointerdown', 'pointermove', 'pressmove'

addLayer(layer, index)

Adds a layer to the map display.
If index is defined the layer will be placed at respective index in drawing hierarchy.
otherwise it's added on top.

addObserver(key, callback)

Adds an observer, supported observers: "zoomlevel", "center"

destroy()

Destroys the map

geoToPixel(lon, lat) → {here.xyz.maps.pixel.Point}

Converts from geo to screen pixel coordinate.

geoToPixel(geo) → {here.xyz.maps.pixel.Point}

Converts from geo to screen pixel coordinate.

getBehavior() → {Object}

Get map behavior.

getCenter() → {here.xyz.maps.geo.Point}

Get map center.

getContainer() → {Node}

Get DOM element of the map.

getFeatureAt(point, options) → {Object}

Get most top rendered feature within the given area of map

getFeaturesAt(point, options) → {Array.<Object>}

Get rendered features within the given area of map

getHeight() → {number}

Gets current height of view port.

getLayers(index) → {Array.<here.xyz.maps.layers.TileLayer>|here.xyz.maps.layers.TileLayer}

Gets layers in map display

getViewBounds() → {here.xyz.maps.geo.Rect}

Gets current view bounds of view port.

getWidth() → {number}

Gets current width of view port.

getZoomlevel() → {number}

Gets current zoomlevel

lockViewport(lock) → {Object}

lock view port by indicating if pan, minLevel and maxLevel are locked

pan(dx, dy, ax, ay)

Moves the map

pitch(pitch)

Set or get map pitch (tilt) in degrees

pixelToGeo(x, y) → {here.xyz.maps.geo.Point}

Converts from screen pixel to geo coordinate

pixelToGeo(pixel) → {here.xyz.maps.geo.Point}

Converts from screen pixel to geo coordinate

refresh(layer)

Refreshes the map

removeEventListener(type, callback)

Removes an event listener.

removeLayer(layer)

Removes a layer provider from the map overlay

removeObserver(key, callback)

Removes an observer

resize(w, h)

Resize the map with new width and height, take width and height of map contain by default.

rotate(rotation)

Set or get map rotation along z-axis

setBehavior(behavior)

Set map behavior.

setCenter(center)

Set new map center.

setCenter(log, lat)

Set new map center.

setViewBounds(bounds)

Set view bounds for the map to display.

setViewBounds(view)

Set view bounds for the map to display.

setZoomlevel(toLevel, toX, toY, animation)

Sets zoomlevel with an optional anchor point

Methods Details

addEventListener(type, callback)

Adds an event listener.
supported events: 'mapviewchangestart', 'mapviewchange', 'mapviewchangeend', 'resize',
'tap', 'dbltap', 'pointerup', 'pointerenter', 'pointerleave', 'pointerdown', 'pointermove', 'pressmove'
Parameters:
Name Type Description
type string event name
callback function callback function // * @param {Object=} Context // * @param {Array.=} layers

addLayer(layer, index)

Adds a layer to the map display.
If index is defined the layer will be placed at respective index in drawing hierarchy.
otherwise it's added on top.
Parameters:
Name Type Argument Description
layer here.xyz.maps.layers.TileLayer layer
index number <optional>
layer-index in drawing hierarchy

addObserver(key, callback)

Adds an observer, supported observers: "zoomlevel", "center"
Parameters:
Name Type Description
key string
callback function // * @param {Object=} context

destroy()

Destroys the map

geoToPixel(lon, lat) → {here.xyz.maps.pixel.Point}

Converts from geo to screen pixel coordinate.
Parameters:
Name Type Description
lon number longitude
lat number latitude
Returns:
pixel coordinate
Type:
here.xyz.maps.pixel.Point

geoToPixel(geo) → {here.xyz.maps.pixel.Point}

Converts from geo to screen pixel coordinate.
Parameters:
Name Type Description
geo here.xyz.maps.geo.Point coordinate
Returns:
pixel coordinate
Type:
here.xyz.maps.pixel.Point

getBehavior() → {Object}

Get map behavior.
Returns:
behavior an object containg two properties: "zoom" and "drag", its boolean value indicates if map zooming and dragging are activated or not.
Type:
Object

getCenter() → {here.xyz.maps.geo.Point}

Get map center.
Returns:
map center
Type:
here.xyz.maps.geo.Point

getContainer() → {Node}

Get DOM element of the map.
Returns:
map container
Type:
Node

getFeatureAt(point, options) → {Object}

Get most top rendered feature within the given area of map
Parameters:
Name Type Argument Description
point here.xyz.maps.pixel.Point | here.xyz.maps.pixel.Rect or rect in pixel
options Object <optional>
Properties
Name Type Argument Description
width number <optional>
width in pixel of rectangle if point geometry is used.
height number <optional>
height in pixel of rectangle if point geometry is used.
layers Array.<here.xyz.maps.layers.TileLayer> <optional>
defines the layer(s) to search in.
Returns:
result object providing "layer" and "feature".
Type:
Object

getFeaturesAt(point, options) → {Array.<Object>}

Get rendered features within the given area of map
Parameters:
Name Type Argument Description
point here.xyz.maps.pixel.Point | here.xyz.maps.pixel.Rect or rect in pixel
options Object <optional>
Properties
Name Type Argument Default Description
width number <optional>
width in pixel of rectangle if point geometry is used.
height number <optional>
height in pixel of rectangle if point geometry is used.
topOnly Boolean <optional>
false if set to true only the top most feature will be returned.
layers Array.<here.xyz.maps.layers.TileLayer> <optional>
defines the layer(s) to search in.
Returns:
zIndex ordered Array of result objects providing: "layer" and "features".
Type:
Array.<Object>

getHeight() → {number}

Gets current height of view port.
Returns:
height of view port
Type:
number

getLayers(index) → {Array.<here.xyz.maps.layers.TileLayer>|here.xyz.maps.layers.TileLayer}

Gets layers in map display
Parameters:
Name Type Argument Description
index number <optional>
Returns:
layers that added to map display
Type:
Array.<here.xyz.maps.layers.TileLayer> | here.xyz.maps.layers.TileLayer

getViewBounds() → {here.xyz.maps.geo.Rect}

Gets current view bounds of view port.
Returns:
Type:
here.xyz.maps.geo.Rect

getWidth() → {number}

Gets current width of view port.
Returns:
width of view port
Type:
number

getZoomlevel() → {number}

Gets current zoomlevel
Returns:
zoomlevel
Type:
number

lockViewport(lock) → {Object}

lock view port by indicating if pan, minLevel and maxLevel are locked
Parameters:
Name Type Description
lock Object
Properties
Name Type Argument Description
pan Boolean <optional>
true to enable panning, false to disable panning.
minLevel number <optional>
minimum zoomlevel to which the map could zoom.
maxLevel number <optional>
maximum zoomlevel to which the map could zoom.
Returns:
an object literal including "pan", "minLevel" and "maxLevel" values.
Type:
Object

pan(dx, dy, ax, ay)

Moves the map
Parameters:
Name Type Argument Description
dx number distance in pixels to pan on x axis
dy number distance in pixels to pn on y axis
ax number <optional>
anchor point on x axis
ay number <optional>
anchor point on y axis

pitch(pitch)

Set or get map pitch (tilt) in degrees
Parameters:
Name Type Argument Description
pitch number <optional>
in degrees

pixelToGeo(x, y) → {here.xyz.maps.geo.Point}

Converts from screen pixel to geo coordinate
Parameters:
Name Type Description
x number
y number
Returns:
geo coordinate
Type:
here.xyz.maps.geo.Point

pixelToGeo(pixel) → {here.xyz.maps.geo.Point}

Converts from screen pixel to geo coordinate
Parameters:
Name Type Description
pixel here.xyz.maps.pixel.Point coordinate
Returns:
geo coordinate
Type:
here.xyz.maps.geo.Point

refresh(layer)

Refreshes the map
Parameters:
Name Type Argument Description
layer here.xyz.maps.layers.TileLayer | Array.<here.xyz.maps.layers.TileLayer> <optional>
Refresh the given layer in map, all layers in map are refreshed if layer is not given.

removeEventListener(type, callback)

Removes an event listener.
Parameters:
Name Type Description
type string event name
callback function callback function // * @param {Object=} Context // * @param {Array.=} layers

removeLayer(layer)

Removes a layer provider from the map overlay
Parameters:
Name Type Description
layer here.xyz.maps.layers.TileLayer layer

removeObserver(key, callback)

Removes an observer
Parameters:
Name Type Description
key string
callback function // * @param {Object=} context

resize(w, h)

Resize the map with new width and height, take width and height of map contain by default.
Parameters:
Name Type Argument Description
w number <optional>
new width of map display
h number <optional>
new height of map display

rotate(rotation)

Set or get map rotation along z-axis
Parameters:
Name Type Argument Description
rotation number <optional>
of map in degrees

setBehavior(behavior)

Set map behavior.
Parameters:
Name Type Description
behavior Object
Properties
Name Type Argument Description
zoom Boolean <optional>
true to enable map zooming, false to disable.
drag Boolean <optional>
true to enable map dragging, false to disable. // * @param {Boolean=} behavior.pitch true to enable map pitching, false to disable. // * @param {Boolean=} behavior.rotate true to enable map rotation, false to disable.
Example:
//to deactivate zooming map:
setBehavior({zoom: false, drag: true})

setCenter(center)

Set new map center.
Parameters:
Name Type Description
center here.xyz.maps.geo.Point center point
Example:
display.setCenter({longitude: 80.10282, latitude: 12.91696});

setCenter(log, lat)

Set new map center.
Parameters:
Name Type Description
log number longitude of the center
lat number latitude of the center
Example:
display.setCenter(80.10282, 12.91696);

setViewBounds(bounds)

Set view bounds for the map to display.
Parameters:
Name Type Description
bounds here.xyz.maps.geo.Rect | Array.<number> is either an geojson bbox array [minLon, minLat, maxLon, maxLat] or geo.Rect defining the viewbounds.

setViewBounds(view)

Set view bounds for the map to display.
Parameters:
Name Type Description
view here.xyz.maps.providers.FeatureProvider.Feature bounds will be set to fit feature on screen.

setZoomlevel(toLevel, toX, toY, animation)

Sets zoomlevel with an optional anchor point
Parameters:
Name Type Argument Default Description
toLevel number new zoomlevel
toX number <optional>
new center in pixel
toY number <optional>
new center in pixel
animation number <optional>
0 zoom transition animation time in ms