当你用鼠标滚动轮放大/缩小时,它会以有线的方式平移地图,我不喜欢,是否有选项可以禁用平移这个与谷歌地图API?
我想地图放大/缩小与滚轮一样,当我按放大和缩小按钮在地图界面(在地图的中心)。
http://jsfiddle.net/4ozyvknr/function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
我想防止在使用鼠标滚轮缩放时平移地图。
我是这样做的,注意当你用鼠标轮图放大/缩小时,无论光标的位置如何,都保持在同一坐标的中心。
工作小提琴function initMap() {
var map_div = document.getElementById('map');
map = new google.maps.Map(map_div, {
center: {lat: 34.049388, lng: -118.259901},
zoom: 10,
scrollwheel: 0
});
map_div.addEventListener('wheel', function(event) {
if (event.deltaY && event.deltaY < 0) {
//scroll up = zoom in;
map.setZoom(map.getZoom() + 1);
} else {
//scroll down zoom out;
map.setZoom(map.getZoom() - 1);
}
//disable scrolling of window
event.preventDefault();
});
}
<div id="map" style="width:100%; height:200px;"></div>
<div style="height:300px;"></div>
<h1>End of Page</h1>
<script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
async defer></script>
如果你想禁用sccollwheel缩放,只需添加scrollwheel: false
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
scrollwheel: false
});
}
编辑:如果你想改变它随滚轮缩放的方式,那么看看这个线程