获取/设置地图图像鼠标位置

时间:2014-12-04 21:48:41

标签: javascript jquery asp.net image google-maps

我需要从头开发asp.net webApplication而不使用谷歌地图api,当用户选择任何位置时在地图图像上设置位置,并在用户选择它的当前位置设置任何图像地图定位器。

更清楚,它就像谷歌地图。我为用户显示地图,然后用户选择任何位置来构建他/她的房子,然后在鼠标离开时我为该位置设置选择器图像“就像谷歌地图上的红色箭头”,并保存所选图像像素,在获取用户数据的过程中,我将该图像选择器放在用户之前选择的位置上。

我需要任何可以帮助我的文章以及可以支持我的工具,谢谢。

1 个答案:

答案 0 :(得分:1)

假设jQuery:

观察相关的鼠标事件(例如点击),它将具有属性pageXpageY(相对于文档的鼠标坐标)。

您将通过offset()

获得的“地图”的偏移量

因此,与地图相关的点击坐标(您必须存储的内容)将是:

x: event.pageX-mapOffset.left
y: event.pageY-mapOffset.top

要绘制标记(红色箭头或其他内容),您必须计算点击坐标的偏移量(默认地图标记锚定在中心/底部)。 从点击坐标中减去标记的高度和半宽,以获得正确的位置。

结果:http://jsfiddle.net/doktormolle/jth8fdy4/