使用标记从Google地图获取纬度/经度坐标

时间:2012-01-25 10:05:33

标签: javascript php google-maps google-maps-api-3

我只是想知道是否有人知道可用的简单脚本将执行以下操作:

在视图中加载谷歌地图,点击它会显示一个标记,将lat和long值保存到变量?

有人知道PHP中是否存在这样的东西吗?

提前致谢

5 个答案:

答案 0 :(得分:29)

也许您正在寻找与此Latitude-Longitude Finder Tool类似的内容。示例代码是API v2。以下是使用Google Maps API v3修改的代码版本:

var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Set lat/lon values for this property',
    draggable: true
});
google.maps.event.addListener(marker, 'dragend', function(a) {
    console.log(a);
    // bingo!
    // a.latLng contains the co-ordinates where the marker was dropped
});

Demo

说明:您必须将标记的draggable属性设置为true。然后,您可以将回调函数挂钩到该标记的dragend事件;新的坐标将传递给函数,您可以将它们分配给JavaScript变量或表单字段。

答案 1 :(得分:6)

// add a click event handler to the map object
    GEvent.addListener(map, "click", function(overlay, latLng)
    {
        // display the lat/lng in your form's lat/lng fields
        document.getElementById("latFld").value = latLng.lat();
        document.getElementById("lngFld").value = latLng.lng();
    });

我认为当你得到lat-lng然后你可以放置标记。

答案 2 :(得分:5)

查看Google maps API v.3。来自events page

 google.maps.event.addListener(map, 'click', function(event) {
   // use event.latLng to place a google.maps.Marker
 });

答案 3 :(得分:3)

到目前为止,我已经管理了以下内容 - 当我点击地图上的任何位置时,如何修改此标记以移动标记位置

http://jsfiddle.net/ZW9jP/

我添加了以下内容,但它似乎没有做任何事情

google.maps.event.addListener(map, 'click', function(event) {
  addMarker(event.latLng);
});  

答案 4 :(得分:3)

以下代码效果很好

var latlng = new google.maps.LatLng(51.4975941, -0.0803232);
var map = new google.maps.Map(document.getElementById('map'), {
    center: latlng,
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    title: 'Set lat/lon values for this property',
    draggable: true
});

google.maps.event.addListener(marker, 'dragend', function (event) {
    document.getElementById("latbox").value = this.getPosition().lat();
    document.getElementById("lngbox").value = this.getPosition().lng();
});