可拖动标记以更新纬度和经度字段 [英] Draggable Marker to Update Lat and Long Fields
问题描述
我想知道是否有人可以帮助我。
I wonder whether someone may be able to help me please.
我已经编写了一些编码（请参见下文），以便用户使用HTML表单，他们输入地址，然后点击搜索按钮。完成此操作后，该位置就会绘制在Google地图上，并且纬度和经度的共同代表会自动输入到我的表单的关联文本框中。
I've put some coding together (please see below) whereby a user goes onto a HTML form, they type in an address and click a 'Search' button. Upon doing this, the location is plotted on the Google map and the Lat and Long co-oridnates are automatically entered into the associated text boxes on my form.
我会怎么做我想做的是，如果可能的话，使标记可拖动，以便用户可以微调位置，并且当他们拖动标记时，我希望纬度和经度字段更改其关联的
What I would like to do, if at all possible, is for the marker to be draggable so the user can fine tune the location, and as they drag the marker, I'd like for the Lat and Long fields to change their associated co-ordinates.
此外，如果可能的话，我也希望在名为 NearestAddress的表格上显示一个字段，以显示最近的地址
In addition, I'd also like, if at all possible, to have a field on the form called 'NearestAddress' to show the nearest address to where the marker has been dragged to.
我设法使标记可拖动，但它们不更新纬度和经度文本框。我也不确定如何添加功能以将更新的地址显示到标记被拖动到的位置。
I've managed to make the markers draggable but they don't update the Latitude and Longitude text boxes. I'm also unsure how to add the functionality to show the updated address to where the marker has been dragged to.
(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地图开发的新手，我甚至不确定是否有可能实现自己的目标想。我现在已经进行了几周的研究，这使我有些疯狂，因此，如果有人可以将我指向正确的方向，将不胜感激。
I am new to Google maps development and I'm not even sure whether it's possible to achieve what I want. I've been working on this now for a few weeks and it's driving me a little crazy, so if someone could perhaps point me in the right direction it would gratefully be received.
非常感谢和问候
Chris
推荐答案
evt.latLng.lat（）。toFixed（3）您应该只使用myMarker对象并抓住它的位置。
Instead of evt.latLng.lat().toFixed(3) you should just use the myMarker object and grab it's position.
获取最近的地址并非易事，但需要反向地理编码，老实说，我认为这样做没有意义。如果没有找到最接近的地址和诸如此类的东西，您将不得不对其进行特殊处理。
Getting the nearest address is not that easy, but requires reverse geocoding, and to be honest I don't see the point in doing it. You would have to make special cases for the occurences where there couldn't be found a closest address and stuff like that.
如果确实要这样做，您可以致电进行这项服务。
If you really want to do it though there is a webservice you can call to do it.
这篇关于可拖动标记以更新纬度和经度字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
