如何解决可拖动标记以更新纬度和经度字段
|| 我想知道是否有人可以帮助我。 我已经进行了一些编码(请参见下文),从而使用户进入HTML表单,他们输入地址并单击“搜索”按钮。完成此操作后,该位置便会绘制在Google地图上,并且纬度和经度共同坐标会自动输入到我的表单的关联文本框中。 我想做的是,如果可能的话,使标记可拖动,以便用户可以微调位置,并且当他们拖动标记时,我希望“纬度”和“长”字段更改其 相关的坐标。 另外,如果可能的话,我也希望在表格上有一个名为“'NearestAddress \'”的字段,以显示最接近标记被拖动到的地址。 我设法使标记可拖动,但是它们不更新“纬度”和“经度”文本框。我也不确定如何添加功能以将更新的地址显示到标记已拖动到的位置。(function() {
// Defining some global variables
var map,geocoder,myMarker,infowindow;
window.onload = function() {
// Creating a new map
var options = {
zoom: 3,center: new google.maps.LatLng(55.378051,-3.435973),mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById(\'map\'),options);
// Getting a reference to the HTML form
var form = document.getElementById(\'LocationSearchForm\');
// Catching the forms submit event
form.onsubmit = function() {
// Getting the address from the text input
var address = document.getElementById(\'Address\').value;
// Making the Geocoder call
getCoordinates(address);
// Preventing the form from doing a page submit
return false;
}
}
// Create a function the will return the coordinates for the address
function getCoordinates(address) {
// Check to see if we already have a geocoded object. If not we create one
if(!geocoder) {
geocoder = new google.maps.Geocoder();
}
// Creating a GeocoderRequest object
var geocoderRequest = {
address: address
}
// Making the Geocode request
geocoder.geocode(geocoderRequest,function(results,status) {
// Check if status is OK before proceeding
if (status == google.maps.GeocoderStatus.OK) {
// Center the map on the returned location
map.setCenter(results[0].geometry.location);
// Creating a new marker and adding it to the map
var myMarker = new google.maps.Marker({
map: map,position: results[0].geometry.location,draggable:true
});
document.getElementById(\'Latitude\').value= results[0].geometry.location.lat();
document.getElementById(\'Longitude\').value= results[0].geometry.location.lng();
google.maps.event.addListener(myMarker,\'dragend\',function(evt){
document.getElementById(\'current\').innerHTML = \'<p>Marker dropped: Current Lat: \' + evt.latLng.lat().toFixed(3) + \' Current Lng: \' + evt.latLng.lng().toFixed(3) + \'</p>\';
});
google.maps.event.addListener(myMarker,\'dragstart\',function(evt){
document.getElementById(\'current\').innerHTML = \'<p>Currently dragging marker...</p>\';
});
map.setCenter(myMarker.position);
myMarker.setMap(map);
}
});
}
})();
我是Google地图开发的新手,我甚至不确定是否有可能实现我想要的目标。我已经为此工作了几个星期,这使我有些疯狂,因此,如果有人可以指出我正确的方向,将不胜感激。
非常感谢和问候
克里斯
解决方法
代替ѭ1,您应该只使用myMarker对象并抓住它的位置。
获取最近的地址并非易事,但需要反向地理编码,老实说,我认为这样做没有意义。对于无法找到最接近的地址和类似内容的情况,您将必须进行特殊处理。
如果您确实要这样做,尽管有一个Web服务,则可以致电进行。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。