禁用使用JavaScript放大和缩小Google地图？

Question

I'm using the google maps in one of my projects but I don't want to have zooming affect in the map so I disabled it via 我在其中一个项目中使用了Google地图，但是我不想在地图中产生缩放影响，因此我通过

zoomControl: false,

however, this only works for desktops and laptops as they dont support multi touch. 但是，这仅适用于台式机和笔记本电脑，因为它们不支持多点触控。

when i view my map in a device that supports multi touch like tablets or smart phones, I can zoom in using pinch and zoom on the device. 当我在支持多点触控的设备（例如平板电脑或智能手机）中查看地图时，可以使用捏放大设备的功能。

I did try map2.getUiSettings().setZoomControlsEnabled(false); 我确实尝试过map2.getUiSettings().setZoomControlsEnabled(false); which has no affect on it and I still can pinch and zoom! 对此没有影响，我仍然可以捏和缩放！

I also tried map.getUiSettings().setZoomControlsEnabled(false); 我也尝试了map.getUiSettings().setZoomControlsEnabled(false); to see if that makes any different but it doesn't! 看看是否有任何不同，但没有！

could someone please advise on this issue? 有人可以建议这个问题吗？

This is my full code: 这是我的完整代码：

                <script>


            function showCurrentLocation(position) {
                var latitude = <?php echo $curLat; ?>;
                var longitude = <?php echo $curLon; ?>;
    var coords2 = new google.maps.LatLng(latitude, longitude);



    var mapOptions2 = {
        zoom: 10,
        center: coords2,
        mapTypeControl: false,
        streetViewControl: false,
        panControl: false,
        zoomControl: false,
        scrollwheel: false,
        navigationControl: false,
        mapTypeControl: false,
        scaleControl: false,
        draggable: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP

    };


    //create the map, and place it in the HTML map div
    map2 = new google.maps.Map(
    document.getElementById("mapPlaceholder"), mapOptions2);

    //place the initial marker
    var marker2 = new google.maps.Marker({
        position: coords2,
        map: map2,
        title2: "Current location!"
    });
}
google.maps.event.addDomListener(window,'load',showCurrentLocation);

map2.getUiSettings().setZoomControlsEnabled(false);
        </script>

any help would be appreciated. 任何帮助，将不胜感激。

Answer 1

You might want to try: 您可能要尝试：

var tblock = function (e) {
    if (e.touches.length > 1) {
        e.preventDefault()
    }

    return false;
}

document.body.addEventListener("touchmove", tblock, true);

Related: 有关：

Disabling pinch-zoom on google maps [Desktop] 在Google地图上禁用捏缩放[桌面]

Google Maps API v3 Disable Pinch to Zoom on iPad Safari Google Maps API v3禁用在iPad Safari上缩放

Edit (working example on Android 4.4.2): 编辑（Android 4.4.2上的工作示例）：

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
html, body, #mapPlaceholder {
    height: 100%;
    margin: 0;
    padding: 0;
}
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script type="text/javascript">
      var map2;

      function initialize() {

        var coords2 = new google.maps.LatLng(38.8, -77);

            var mapOptions2 = {
                zoom: 10,
                center: coords2,
                mapTypeControl: false,
                streetViewControl: false,
                panControl: false,
                zoomControl: false,
                scrollwheel: false,
                navigationControl: false,
                mapTypeControl: false,
                scaleControl: false,
                draggable: true,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };


            //create the map, and place it in the HTML map div
            map2 = new google.maps.Map(document.getElementById("mapPlaceholder"), mapOptions2);

            //place the initial marker
            var marker2 = new google.maps.Marker({
                position: coords2,
                map: map2,
                title: "Current location!"
            });
             var tblock = function (e) {
            if (e.touches.length > 1) {
                e.preventDefault()
            }

            return false;
        }

        document.body.addEventListener("touchmove", tblock, true);
      }
      google.maps.event.addDomListener(window, 'load', initialize);

</script>
</head>
<body>
    <div id="mapPlaceholder"></div>
</body>
</html>

Answer 2

Add this code to your mapOptions: 将此代码添加到您的mapOptions中：

minZoom: 10,
maxZoom: 10

Basically, set minZoom and maxZoom to the same value to disable zoom on your map. 基本上，将minZoom和maxZoom设置为相同的值即可禁用地图缩放。

禁用使用JavaScript放大和缩小Google地图？

问题描述

2 个解决方案

解决方案1
3 2015-01-25 17:13:33

解决方案2
1 2018-03-12 07:34:56

禁用使用JavaScript放大和缩小Google地图？

问题描述

2 个解决方案

解决方案1 3 2015-01-25 17:13:33

解决方案2 1 2018-03-12 07:34:56

解决方案1
3 2015-01-25 17:13:33

解决方案2
1 2018-03-12 07:34:56