Ctrl + Scroll to Zoom Google지도 비활성화
아무도 CTRL+ 를 비활성화하는 방법을 알고 Scroll
있습니까?
먼저 마우스 휠을 움직이면지도가 확대 / 축소됩니다. 그러나 이제는 CTRL+ 마우스 휠 스크롤을 눌러 확대 / 축소 하도록 요청합니다 .
이 기능을 어떻게 비활성화합니까? 문서에서 아무것도 찾을 수없는 것 같습니다.
https://developers.google.com/maps/documentation/javascript/controls#ControlOptions
gestureHandling: 'greedy'
지도 옵션 으로 전달 해야합니다.
문서 : https://developers.google.com/maps/documentation/javascript/interaction#gestureHandling
예를 들면 :
const map = new google.maps.Map(mapElement, {
center: { 0, 0 },
zoom: 4,
gestureHandling: 'greedy'
});
스크롤 확대 / 축소를 완전히 비활성화해도 괜찮다면 scrollwheel: false
. 확대 / 축소 컨트롤 ( zoomControl: true
) 을 제공하는 경우 사용자는 확대 / 축소 버튼을 클릭하여지도를 계속 확대 할 수 있습니다 .
문서 : https://developers.google.com/maps/documentation/javascript/reference("scrollwheel "에 대한 페이지 검색)
const map = new google.maps.Map(mapElement, {
center: { 0, 0 },
zoom: 4,
scrollwheel: false,
zoomControl: true
});
gestureHandling: 'greedy'
지도 위에 오버레이가 있었기 때문에 수정 사항을 적용 할 수 없었습니다. 결국 mousewheel
이벤트 를 감지 하고 ctrl
속성을 true로 설정했습니다 .
// Load maps and attach event listener to scroll event.
var $map = $('.map');
$map[0].addEventListener('wheel', wheelEvent, true);
function wheelEvent(event) {
// Set the ctrlKey property to true to avoid having to press ctrl to zoom in/out.
Object.defineProperty(event, 'ctrlKey', { value: true });
}
오버레이 만 숨기고 싶지만 스크롤 및 확대 / 축소 기능을 비활성화하려는 경우 (이전처럼) CSS를 사용하여 오버레이를 숨길 수 있습니다.
.gm-style-pbc {
opacity: 0 !important;
}
이렇게하면 모바일에서도 숨겨 지므로 다음과 같이 사용하여 "지도를 이동하려면 두 손가락 사용"을 표시 할 수 있습니다.
@media only screen and ( min-width: 980px ) {
.gm-style-pbc {
opacity: 0 !important;
}
}
속성 gestureHandling
내 중첩은 options
버전 "3.35.6"에서 저에게 효과적이었습니다.
map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
options:{
gestureHandling: 'greedy'
}
});
참고 URL : https://stackoverflow.com/questions/45729047/disable-the-ctrl-scroll-to-zoom-google-maps
'developer tip' 카테고리의 다른 글
하나의 양식에 여러 라디오 버튼 그룹 (0) | 2020.10.05 |
---|---|
설치된 React-Native 버전을 확인하는 방법 (0) | 2020.10.05 |
WPF : 스타일이 지정된 목록 상자에서 포커스가있는 항목 주위의 점선 테두리 제거 (0) | 2020.10.05 |
Visual Studio 2010에서 PDB 파일을 찾거나 열 수없는 이유는 무엇입니까? (0) | 2020.10.05 |
키가 다운되었는지 확인 하시겠습니까? (0) | 2020.10.04 |