What i am trying to achieve is make a DIV and display world map image on it or as a background.. & when user clicks some somewhere on the map, i catch the mouse-click location,
then i am some how going to translate the mouse's X,Y cords into longitude,latitude and then run an AJAX to display some data.
My problem is:
Look at this example:
Following posts may also help:
In HTML you set onMouseMove event:
<div onMouseMove="getPositions();"
style="width:200px;height:100px"></div>
And javascript function:
function getPositions(ev) {
if (ev == null) { ev = window.event }
_mouseX = ev.clientX;
_mouseY = ev.clientY;
}
Unless you have a reason to do it from scratch, I would recommend Google Maps Api.
You'll notice that the Map object has a click event to which you can bind a callback that receives a MouseEvent that contains lat/long coords. Check out this example.
In the event handler you can get it through the mouseEvent Args.
Excerpt from http://msdn.microsoft.com/en-us/library/bb404721.aspx -
function onMouseLeftButtonUp(sender, mouseEventArgs)
{
// Return a Point object representing the x- and y-coordinates of the current mouse position
// relative to the reference object.
var pt = mouseEventArgs.getPosition(sender.findName("referenceObject"));
// Display the current mouse position.
sender.findName("Status").text = pt.x + " : " + pt.y;
}
