Question

是否可以在Google Map API中挂钩鼠标滚轮事件？没有详细说明，我需要鼠标滚轮像谷歌地图中一样进行缩放，但我还需要附加到鼠标滚轮事件以用于其他目的。

但每当我在MapOptions中将scrollwheel设置为true时，Google Map API会消除所有mousewheel事件并拒绝分享它们（你认为这非常以自我为中心吗？）！

收听zoom_changed之类的谷歌地图事件不会起作用，因为如果地图处于最小或最大缩放级别，它们不会触发，这是我需要的。更具体地说，我需要知道用户是否已经在最大缩放级别时尝试缩放。

这种“感觉”可以解决，但我的直觉并不总是存在： - ）

有什么想法吗？

Answer 1

您可以使用普通的DOM事件侦听器来完成此操作。唯一的技巧是你必须使用捕获事件监听器，这样你才能在Maps API之前看到事件。这是因为Maps API似乎调用event.stopPropagation()，因此普通的事件侦听器不会看到该事件。通过使用捕获侦听器，您可以先看到它。

以下是一个示例，假设您的地图有#map_canvas DIV，事件日志有#log DIV：

function initialize() {
    var $map = $('#map_canvas');
    var latLng = new google.maps.LatLng( 40.708762, -74.006731 );

    var map = new google.maps.Map( $map[0], {
        zoom: 15,
        center: latLng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    function wheelEvent( event ) {
        $('#log').append( '<div>wheel!</div>' );
    }

    $map[0].addEventListener( 'mousewheel', wheelEvent, true );
    $map[0].addEventListener( 'DOMMouseScroll', wheelEvent, true );
};

$( initialize );

请注意，代码会侦听Firefox的DOMMouseScroll事件和其他浏览器的mousewheel事件。您将需要处理这两个事件的event对象的差异。

这是fiddle。

在Google Map API中连接鼠标滚轮事件

1 个答案: