SW/JavaScript

Java Script : Google 지도에서 스크롤 휠 줌 비활성화 : 기능, 구현, 예제

얇은생각 2020. 6. 29. 07:30
반응형

Java Script : Google 지도에서 스크롤 휠 줌 비활성화 : 기능, 구현, 예제

 

웹 사이트에서 Google지도 API를 사용하면 스크롤 마우스 이벤트가 무시되고 지도에서 확대/축소 역할을합니다. 이 기능을 사용하면 지도에서 특정 위치를 쉽게 확대/축소 할 수 있습니다. 

위치 위에 마우스를 놓고 마우스 휠을 사용하여 확대 또는 축소 할 수 있습니다. 그러나 크거나 전체 화면 맵이 있는 경우 페이지에서 스크롤 할 때 맵이 축소되어 마우스 휠을 사용하여 페이지를 스크롤 하기가 어려워집니다.

Google Maps API 버전 V3에서 Google은 마우스 휠이 지도에서 확대되지 않도록 하는 새로운 매개 변수를 도입했습니다. 이 기능을 끄면 마우스가 지도 위에 있어도 페이지를 스크롤 할 수 있습니다. 

즉, 지도를 확대하는 유일한 방법은 지도 왼쪽의 확대/축소 컨트롤을 사용하는 것입니다. 스크롤 휠을 비활성화하기 위해 추가해야하는 매개 변수를 스크롤 휠이라고 합니다. 이를 false로 설정하면 기능이 비활성화됩니다.

scrollwheel: false

 

 

이 매개 변수는 새지도 객체를 만들 때지도 옵션에서 정의됩니다.

var mapOptions = {
    zoom: 10,
    mapTypeId: google.maps.MapTypeId.SATELLITE,
    scrollwheel: false      
}

map = new google.maps.Map(document.getElementById("map"), mapOptions);
반응형