从标记获取纬度经度并存储到SQL数据库

时间:2014-02-14 12:04:12

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

我正在制作我的最终项目 我的项目与Salman的Latitude Longitude Finder工具类似,但不是显示坐标,而是使用简单查询将坐标存储在SQL数据库中。 因为我缺乏编码技能,我无法做到这一点,所以任何人都可以帮助我?

接下来我该怎么办? 我必须做什么变量?

这是直接来自Salman的源代码

<form id="mapform" action="#">
<input id="mapinput" type="text" style="width: 80%;" value="Institut Teknologi Telkom, Sukapura, Dayeuhkolot, Bandung 40257, Indonesia" maxlength="100">
<input type="submit" style="width: 10%;" value="Find">
</form> 
<div id="mapdiv" style="height: 400px; width:90%"></div>
<div id="mapoutput" style="width:90%;background-color: #FFDD22; font-weight:      bold;">Latitude:<br>Longitude:</div>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?       v=3&amp;sensor=true&amp;key=AIzaSyAUQHXuw8OR1CzCPpo7bLMt_H_nauUHXKw"></script>
<script type="text/javascript">
google.maps.event.addDomListener(window, "load", function() {
//
// initialize map
//
var map = new google.maps.Map(document.getElementById("mapdiv"), {
  center: new google.maps.LatLng( -6.976801, 107.630835),
  zoom: 16,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});
//
// initialize marker
//
var marker = new google.maps.Marker({
  position: map.getCenter(),
  draggable: true,
  map: map
});
//
// intercept map and marker movements
//
google.maps.event.addListener(map, "idle", function() {
  marker.setPosition(map.getCenter());
  document.getElementById("mapoutput").innerHTML = "<a   href=\"https://maps.google.com/maps?q=" + encodeURIComponent(map.getCenter().toUrlValue()) + "\" target=\"_blank\" style=\"float: right;\">Go to maps.google.com</a>Latitude: " + map.getCenter().lat().toFixed(6) + "<br>Longitude: " + map.getCenter().lng().toFixed(6);
});
google.maps.event.addListener(marker, "dragend", function(mapEvent) {
  map.panTo(mapEvent.latLng);
});

//
// initialize geocoder
//
var geocoder = new google.maps.Geocoder();
google.maps.event.addDomListener(document.getElementById("mapform"), "submit",      function(domEvent) {
  if (domEvent.preventDefault){
    domEvent.preventDefault();
  } else {
    domEvent.returnValue = false;
  }
  geocoder.geocode({
    address: document.getElementById("mapinput").value
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var result = results[0];
      document.getElementById("mapinput").value = result.formatted_address;
      if (result.geometry.viewport) {
        map.fitBounds(result.geometry.viewport);
      }
      else {
        map.setCenter(result.geometry.location);
      }
    } else if (status == google.maps.GeocoderStatus.ZERO_RESULTS) {
      alert("Sorry, the geocoder failed to locate the specified address.");
    } else {
      alert("Sorry, the geocoder failed with an internal error.");
    }
  });
  });
  });
</script>

1 个答案:

答案 0 :(得分:1)

只需将标记的dragend事件编辑为

即可
google.maps.event.addListener(marker, 'dragend', function (event) {
    var lat = this.getPosition().lat();
    var lng = this.getPosition().lng();
    //use an AJAX function to save the lat/lng to the data base
    $.ajax({
        type:'POST',
        data:{latitude:lat, longitude:lng},
        url:"savecoords.php",
        success:function(response){
            if(reponse=="success"){
                alert('Location marked');
            }
            else{
                alert('Cant mark location');
            }
        },
        error:function(){
            alert('An error occured');
        }
    });
});

在AJAX函数中,latlngsavecoords.php方法中传递给文件latitude thrugh变量longitudePOST。在该文件中,您可以访问$_POST['latitude']$_POST['longitude']的值。然后,您需要创建savecoords.php文件,内容必须如下:

<强> savecoords.php

<?php
    $latitude   =   $_POST['latitude'];
    $longitude  =   $_POST['longitude'];

    //establish mysqli connection

    $query      =   'Your save query with $latitude and $longitude';    
    if(mysqli_query($query)){
        echo "success";
    }
    else{
        echo "failed";
    }   
?>