HERE Maps API - get the geocoordinates when user clicks mouse over the map
This article shows how to get the geolocation behind user's mouse click over the map component.
The code example calls the getMouseXY function when the user clicks on the map. Note the different behaviour in case of Internet Explorer browser and other browser.
//Define the map component e.g. in style of this
//
// HTML file
//
...
<script type="text/javascript"src="http://api.maps.nokia.com/2.0.0/jsl.js" charset="utf-8"></script>
</head>
<body onload="init()">
<center>
<div id="map" style="width:640px; height:360px;"></div>
...
//
// JavaScript file
//
...
function init(){
...
// Prepare to record all mouse movements
IE = document.all?true:false;
if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = getMouseXY;
// with the above
...
map = new nokia.maps.map.Display(document.getElementById("map"),
{
components: [ new nokia.maps.map.component.Behavior(),
new nokia.maps.map.component.ZoomBar(),
new nokia.maps.map.component.Overview(),
new nokia.maps.map.component.TypeSelector(),
new nokia.maps.map.component.ScaleBar() ],
zoomLevel: 3,
eventListener: myListener,
center: [52.51, 13.4] // default map center point (not the location retrieved)
});
...
// Grab the user mouse x and y coordinates
...
function getMouseXY(e) {
if (IE) { // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft;
tempY = event.clientY + document.body.scrollTop;
}
else { // grab the x-y pos.s if browser is NS
tempX = e.pageX;
tempY = e.pageY;
}
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
return true;
}
...
// Alert the user what is the geolocation of that screen coordinate
alert(map.pixelToGeo(tempX, tempY));
...
Example alert window
