我正在制作我的最终项目 我的项目与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&sensor=true&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>
答案 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函数中,lat
和lng
在savecoords.php
方法中传递给文件latitude
thrugh变量longitude
和POST
。在该文件中,您可以访问$_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";
}
?>