所以我设法在我的网站上用可拖动的标记实现了谷歌地图。我现在唯一的问题是我不知道如何保存上次放置标记的位置。因此,如果用户拖动标记 4 次,我只想保存第 4 次的位置(纬度和经度)。
这是我到目前为止所拥有的(这是没有保存位置的代码的工作代码):
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map = new GMap2(document.getElementById("googleMap"));
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
var centrePoint = new GLatLng('53.34870686020199', '-6.267356872558594');
map.setCenter(centrePoint, 14);
var marker = new GMarker(centrePoint, {draggable: true});
map.addOverlay(marker);
GEvent.addListener(marker, "dragend", function() {
var point = marker.getPoint();
map.panTo(point);
document.getElementById("latitude").value = point.lat();
document.getElementById("longitude").value = point.lng();
});
function initialize ()
{
Brussels = new google.maps.LatLng (50.833333, 4.333333);
myOptions =
{
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: Brussels,
streetViewControl: false
}
map = new google.maps.Map (document.getElementById ("googleMap"), myOptions);
marker = new google.maps.Marker ({position: Brussels, title: "Brussel, BE"});
marker.setMap (map);
marker.setDraggable (true);
google.maps.event.addListener (marker, 'dragend', function (event)
{
var point = marker.getPosition();
map.panTo(point);
});
}
保存是指保存到本地存储吗?
您可以修改 dragend 事件侦听器,以便它使用标记拖动到的位置的纬度和经度更新本地存储。由于每当拖动标记时都会触发此事件,因此本地存储将始终包含最后一次拖动的位置(即,如果用户拖动标记 4 次,本地存储将保持第四次拖动的位置)。
google.maps.event.addListener (marker, 'dragend', function (event)
{
var point = marker.getPosition();
map.panTo(point);
// save location to local storage
localStorage['lastLat'] = point.lat();
localStorage['lastLng'] = point.lng();
});
显然,这仅适用于支持本地存储的浏览器,因此在尝试访问本地存储之前检查这一点是明智的