google-maps - 用户在地图上设置他们的真实位置

Question

我想知道是否有人这样做过，或者可以指出我使用 Google Maps API 最好是 PHP 和 JS 的正确方向。

我希望能够获取用户的地址和邮政/邮政编码，然后显示显示他们位置的地图。

由于英国邮政编码的性质，“实际”位置可能与显示的位置有一定距离。（例如在威尔士 - 一个高尔夫俱乐部的邮政编码可以覆盖大约 2 平方英里的区域，其中有小路和小巷纵横交错）。

然后我希望用户能够拖动指针 - 或其他一些方法 - 并指向他们在地图上的真实位置 - 并将这一点（纬度/经度）传递回我的代码。

Answer 1

基本概念：

1. 将您拥有的数据地理编码为 LatLng 值：https ://developers.google.com/maps/documentation/javascript/reference#Geocoder
2. 使用步骤 1 中的 LatLng，在地图上放置一个可拖动的标记：https ://developers.google.com/maps/documentation/javascript/reference#Marker
3. 收听dragend标记上的事件以获取新的 LatLng。

适用样品：

• 地理编码
• 可拖动标记

Answer 2

以下是当用户点击我的 Google 地图时我用来获取 lat 和 lng 的代码：

  //capture lat and lng when user clicks on map
  google.maps.event.addListener(map, "click", function(event) {
     var lat = event.latLng.lat();
     var lng = event.latLng.lng();
     $("#lat").val(lat);
     $("#lng").val(lng);
     //console.log("Lat: "+ event.latLng.lat() +"Lng: "+ event.latLng.lng());    
  }); 

这是我用来将数据提交到服务器以添加到数据库中的 JQuery（用户可以在其中创建更多变量的表单）：

    //when user clicks submit button on form, use ajax/json to send info to db
    $("#submit").click(function() {
        var lat = $("#lat").val();
        var lng = $("#lng").val();
        var type = $("#type").val();
        var des = $("#des").val();
        $.ajax({
              type: "POST",
              url: "DB_addProblem.php",
              data: "lat="+ lat + "&lng="+ lng + "&type="+ type + "&des="+ des
        }).done(function( msg ) {
              alert( "Data Submited: " + msg + "!!!");
        });
     });