我在我的一个项目中使用谷歌地图，但我不想在 map 中产生缩放效果，所以我通过
禁用了它zoomControl: false,
但是，这仅适用于台式机和笔记本电脑，因为它们不支持多点触控。
当我在支持多点触控的设备(如平板电脑或智能手机)中查看我的 map 时，我可以在设备上使用捏合和缩放来放大。
我试过 map2.getUiSettings().setZoomControlsEnabled(false); 没有任何影响，我仍然可以捏合和缩放!
我还尝试了 map.getUiSettings().setZoomControlsEnabled(false); 看看是否有任何不同，但事实并非如此!
有人可以就这个问题提出建议吗？
这是我的完整代码:
<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>
如有任何帮助，我们将不胜感激。
最佳答案
你可能想试试:
var tblock = function (e) {
if (e.touches.length > 1) {
e.preventDefault()
}
return false;
}
document.body.addEventListener("touchmove", tblock, true);
相关:
Disabling pinch-zoom on google maps [Desktop]
Google Maps API v3 Disable Pinch to Zoom on iPad Safari
编辑(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>
关于javascript - 使用 JavaScript 禁用缩放谷歌地图？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28138510/