我一直在試圖添加谷歌地圖到我的網站,標記將顯示用戶的當前位置,用戶可以拖動標記,位置名稱將在文本框中。但是我的標記沒有移動,也沒有移動文本框中的位置,反之亦然。我想實現這一點:enter link description here谷歌地圖標記不會拖動
function initMap() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition, showError);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
lat = position.coords.latitude;
lon = position.coords.longitude;
latlon = new google.maps.LatLng(lat, lon)
mapholder = document.getElementById('map')
var myOptions = {
center: latlon, zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP,
mapTypeControl: false,
navigationControlOptions:
{ style:google.maps.NavigationControlStyle.SMALL }
}
var map = new google.maps.Map(document.getElementById("map"), myOptions);
var marker = new google.maps.Marker({
position: latlon,
map: map,
title: "Choose",
draggable: true
});
}
function showError(error) {
switch (error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
}
updateMarkerPosition(latlon);
geocodePosition(latlon);
// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function() {
updateMarkerAddress('Dragging...');
});
google.maps.event.addListener(marker, 'drag', function() {
updateMarkerStatus('Dragging...');
updateMarkerPosition(marker.getPosition());
});
google.maps.event.addListener(marker, 'dragend', function() {
updateMarkerStatus('Drag ended');
geocodePosition(marker.getPosition());
});
</script>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
async defer>
</script>
任何日誌或信息你遇到的錯誤? – goblin
沒有。我可以查看地圖和標記。但標記不動。 – Ash
您應該在創建標記後立即添加偵聽器。 – goblin