jQuery或Javascript助手从Google地图获取LatLng

Question

我需要让用户输入地图任意点的地理编码(LatLng),以便存储在数据库中以后再使用.

在接受职责之前,你知道一个jQuery插件或javascript:

• 弹出谷歌地图
• 用户导航地图
• 用户单击一个点
• 它将选定的LatLng放在文本框中
• 关闭弹出窗口

(或沿线的东西)

Answer 1

我强烈建议使用v3 api,因为它同样易于使用,并且作为插件快速学习.另外一个插件不会为你提供弹出窗口.

所以这是我的解决方案:

1.进口

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

2.在你的HTML中放置一个div
<div class="mapClass" id="mapDiv" ></div>

3. 初始化地图

var map;

var greece = new google.maps.LatLng(38.822590,24.653320);

//Map options
var mapOptions = {
    zoom: 6,
    center: greece,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
//Make a new map
map = new google.maps.Map(document.getElementById("mapDiv"),mapOptions);

瞧,你得到你的地图和导航控件

4. 绑定onclick事件 google.maps.event.addListener(map, "click",yourFunction);

并实现你的功能,从点击和填充一些文本字段或其他东西加上标记

function getCoordinates(event){
  if (event.latLng) {
       var marker;
       //Fill your textfields
       document.getElementById('yourLngTextfield').value=event.latLng.lng();
       document.getElementById('yourLatTextfield').value=event.latLng.lat();

       //Remove any previously added marker and add a marker to that spot
       if(marker!=null){
            marker.setMap(null);
       }

       var latlng = event.latLng;
       marker = new google.maps.Marker({
             position: latlng
             map: map
        });
  }
}

就是这样.虽然没有经过测试.

现在,如果你想在弹出窗口中添加所有这些,请使用colorbox

如果您仍想使用插件,请点击此处

干杯