×
Namespaces

Variants
Actions

HERE Maps API - How to pan the map

From Nokia Developer Wiki
Jump to: navigation, search

This article explains how to use the panning method on the map. Feel free to modify and utilize whole or partial for your own purposes!

Article Metadata
Code ExampleTested with
Devices(s): Internet Explorer, Firefox, Google Chrome, Opera
Compatibility
Platform(s): Web browser
Dependencies: HERE Maps 2.5.3
Article
Keywords: HERE Maps, JavaScript, Panning
Created: Maveric (27 Jun 2011)
Updated: avnee.nathani (31 Dec 2011)
Last edited: jasfox (28 Nov 2013)

Contents

Prerequistites

HERE Maps API supported web browser (basically any modern browser should do).

Example code

After the map is intiallised, a timer is set up setInterval (panTheMap, 300); to pan the pan three times a second. The panning code is shown below:

function panTheMap() {  
x = x + incX;
if (Math.abs(x) > 20 ){
incX = -incX;
}
 
y= y + incY;
if (Math.abs(y) > 20 ){
incY = -incY;
}
 
map.pan(0, 0, x, y);
}

Screenshot

NokiaMapsPanning.png

To see the example in action:

http://rawgithub.com/heremaps/examples/master/maps_api_for_javascript/simple-examples/panning-the-map.html

For more on the HERE Maps API

Please check out the HERE Maps API full documentation and API reference here:

You may also access the interactive API explorer

Summary

Using the map panning feature you could create e.g. a game, where the map is moving and the user should e.g. find something on the map and click it before the area vanishes from sight, just an idea ;) develop your own =)? Side scrolling game...? =)

This page was last modified on 28 November 2013, at 14:26.
201 page views in the last 30 days.