谷歌地图 - 问题与地图拖动不释放 [英] Google Map - issue with map drag not releasing

问题描述

我有一个谷歌地图，当鼠标点击被释放时，它不会被释放。当我点击鼠标，拖动地图并释放点击时，地图仍然保持拖动鼠标。当用户试图放置标记时，这会导致一些奇怪的定位。这里是我的代码：

  var initialLocation; 
 var siberia = new google.maps.LatLng（44.9111410149792，-93.0537195）; 
 var newyork = new google.maps.LatLng（40.69847032728747，-73.9514422416687）; 
 var browserSupportFlag = new Boolean（）; 
 
 
 
函数initialize（）{
 var myOptions = {
 zoom：6，
 mapTypeId：google.maps.MapTypeId.HYBRID 
}; 
 var map = new google.maps.Map（document.getElementById（map_canvas），myOptions）; 
 
 myListener = google.maps.event.addListener（地图，'click'，函数（事件）{
 placeMarker（event.latLng）; 
 google.maps.event。 removeListener（myListener）; 
}）; 
 google.maps.event.addListener（map，'drag'，function（event）{
 placeMarker（event.latLng）; 
 google.maps.event.removeListener（myListener）; 
}）; 
 
 //尝试W3C地理定位（首选）
 if（navigator.geolocation）{
 browserSupportFlag = true; 
 navigator.geolocation.getCurrentPosition（function（position）{
 initialLocation = new google.maps.LatLng（position.coords.latitude，position.coords.longitude）; 
 map.setCenter（initialLocation ）; 
}，function（）{
 handleNoGeolocation（browserSupportFlag）; 
}）; 
 //尝试Google Gears Geolocation 
} else if（google.gears）{
 browserSupportFlag = true; 
 var geo = google.gears.factory.create（'beta.geolocation'）; 
 geo.getCurrentPosition（function（position）{
 initialLocation = new google.maps.LatLng（position.latitude，position.longitude）; 
 map.setCenter（initialLocation）; 
 }，function（）{
 handleNoGeoLocation（browserSupportFlag）; 
}）; 
 //浏览器不支持地理位置
}其他{
 browserSupportFlag = false; 
 handleNoGeolocation（browserSupportFlag）; 
 
 
函数handleNoGeolocation（errorFlag）{
 if（errorFlag === true）{
 alert（Geolocation service failed。）; 
 initialLocation = newyork; 
} else {
 alert（您的浏览器不支持地理定位，我们已将您置于美丽的明尼阿波利斯。）; 
 initialLocation = siberia; 
} 
 map.setCenter（initialLocation）; 
 
 
 $ b函数placeMarker（location）{
 var marker = new google.maps.Marker（{
 position：location，
 map：map，
 draggable：true 
}）; 
 map.setCenter（location）; 
 var markerPosition = marker.getPosition（）; 
 populateInputs（markerPosition）; 
 google.maps.event.addListener（marker，drag，function（mEvent）{
 populateInputs（mEvent.latLng）; 
}）; 
} 
函数populateInputs（pos）{
 document.getElementById（t1）。value = pos.lat（）
 document.getElementById（t2）。value = pos.lng（）; 
 
 
 $ / code $ / pre 
 
解决方案
删除这部分脚本。它适用于我： 
 
 
  google.maps.event.addListener（map，'drag'，function（event）{
 placeMarker（event.latLng）; 
 google.maps.event.removeListener（myListener）; 
}）; 
  
 
I have a google map that is not releasing from being dragged when the mouse click is released.  When I click the mouse, drag the map and release the click, the map still keeps dragging with the mouse.  This causes some strange positioning stuff while users are trying to place markers.  Here is my code:
    var initialLocation;
    var siberia = new google.maps.LatLng(44.9111410149792, -93.0537195);
    var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
    var browserSupportFlag =  new Boolean();



    function initialize() {
        var myOptions = {
            zoom: 6,
            mapTypeId: google.maps.MapTypeId.HYBRID
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        myListener = google.maps.event.addListener(map, 'click', function(event) {
            placeMarker(event.latLng);
            google.maps.event.removeListener(myListener);
        });
        google.maps.event.addListener(map, 'drag', function(event) {
            placeMarker(event.latLng);
            google.maps.event.removeListener(myListener);
        });

        // Try W3C Geolocation (Preferred)
        if(navigator.geolocation) {
            browserSupportFlag = true;
            navigator.geolocation.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
                map.setCenter(initialLocation);
            }, function() {
                handleNoGeolocation(browserSupportFlag);
            });
            // Try Google Gears Geolocation
        } else if (google.gears) {
            browserSupportFlag = true;
            var geo = google.gears.factory.create('beta.geolocation');
            geo.getCurrentPosition(function(position) {
                initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
                map.setCenter(initialLocation);
            }, function() {
                handleNoGeoLocation(browserSupportFlag);
            });
            // Browser doesn't support Geolocation
        } else {
            browserSupportFlag = false;
            handleNoGeolocation(browserSupportFlag);
        }

        function handleNoGeolocation(errorFlag) {
            if (errorFlag === true) {
                alert("Geolocation service failed.");
                initialLocation = newyork;
            } else {
                alert("Your browser doesn't support geolocation. We've placed you in beautiful Minneapolis.");
                initialLocation = siberia;
            }
                map.setCenter(initialLocation);

        }

        function placeMarker(location) {
            var marker = new google.maps.Marker({
                position: location,
                map: map,
                draggable: true
            });
            map.setCenter(location);
            var markerPosition = marker.getPosition();
            populateInputs(markerPosition);
            google.maps.event.addListener(marker, "drag", function (mEvent) {
                populateInputs(mEvent.latLng);
            });
        }
        function populateInputs(pos) {
            document.getElementById("t1").value=pos.lat()
            document.getElementById("t2").value=pos.lng();
        }
    }

解决方案
Delete this part of the script. it worked for me:
google.maps.event.addListener(map, 'drag', function(event) {
    placeMarker(event.latLng);
    google.maps.event.removeListener(myListener);
});


                        
这篇关于谷歌地图 - 问题与地图拖动不释放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！