Определить местоположение щелчка мыши

Question

То, чего я пытаюсь добиться, - это создать DIV и отобразить на нем изображение карты мира или в качестве фона. И когда пользователь нажимает на какое-то место на карте, я ловлю место щелчка мышью,

затем я кое-как перевожу X, Y шнуры мыши в долготу, широту и затем запускаю AJAX для отображения некоторых данных.

Моя проблема:

• Как получить местоположение щелчка мышью с помощью JavaScript
• Как преобразовать глобальное местоположение щелчка в относительные координаты X, Y DIVслой

Answer 1

Посмотрите на этот пример:

• Нажмите на изображение и получите координаты с помощью Javascript

Следующие сообщения также могут помочь:

• Получите точную позицию для клика на связанном изображении, используя jquery

• Создание HTML-карт изображений

Answer 2

В HTML вы устанавливаете событие onMouseMove:

<div onMouseMove="getPositions();"
style="width:200px;height:100px"></div>

И функцию javascript:

function getPositions(ev) {
if (ev == null) { ev = window.event }
   _mouseX = ev.clientX;
   _mouseY = ev.clientY;
}

Answer 3

В обработчике событий вы можете получить его через mouseEvent Args.

Выдержка из 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;
}

Answer 4

Если у вас нет причин сделать это с нуля, я бы порекомендовал Google Maps Api .

. Вы заметите, что объект Map имеет щелчокСобытие, к которому вы можете привязать обратный вызов, который получает MouseEvent, содержащий координаты широты и долготы.Посмотрите этот пример .