禁用使用JavaScript捏捏和放大Google地图? [英] disable pinch and zoom in google maps using JavaScript?
问题描述
我在我的一个项目中使用了google地图，但是我不想在地图中产生缩放影响，所以我通过
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
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.
我确实尝试过map2.getUiSettings().setZoomControlsEnabled(false);，它对此没有任何影响，但我仍然可以捏和缩放！
I did try map2.getUiSettings().setZoomControlsEnabled(false); which has no affect on it and I still can pinch and zoom!
我还尝试了map.getUiSettings().setZoomControlsEnabled(false);，看看是否有什么不同，但这没什么！
I also tried map.getUiSettings().setZoomControlsEnabled(false); to see if that makes any different but it doesn't!
有人可以就这个问题提供建议吗?
could someone please advise on this issue?
这是我的完整代码:
<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.
推荐答案
您可能想尝试:
var tblock = function (e) {
if (e.touches.length > 1) {
e.preventDefault()
}
return false;
}
document.body.addEventListener("touchmove", tblock, true);
相关:
> Google Maps API v3禁用在iPad Safari上缩放
编辑(Android 4.4.2上的工作示例):
Edit (working example on 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捏捏和放大Google地图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
