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

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。

适用样本：

• Geocoding
• Draggable marker

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 + "!!!");
        });
     });