移动设备中的上下文菜单不适用于长按... Google Maps API

时间:2017-08-31 16:17:09

标签: javascript api google-maps maps touch

我正在开发一个项目并使用 Google Maps API 。 我遇到移动设备问题。

我正在使用GMaps.js 该示例也无法正常工作(长按事件)

示例代码 - file gmaps.js:441

google.maps.event.addListener(this.map, 'rightclick', function(e) {
  if (options.rightclick) {
    options.rightclick.apply(this, [e]);
  }

  if(window.context_menu[self.el.id]['map'] != undefined) {
    self.buildContextMenu('map', e);
  }
});

如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

解决问题,模拟点长按。 befor:

    google.maps.event.addListener(this.map, 'rightclick', function (e) {

插入代码:

    /**
     * Start TIMER open context menu
    */
    google.maps.event.addListener(this.map, 'mousedown', function(e) {
        var context_menu_element = getElementById('gmaps_context_menu');

        document.pressTimer = window.setTimeout(function() {
            jQuery(context_menu_element).addClass('mouse_tap');

            if (options.rightclick) {
                options.rightclick.apply(this, [e]);
            }

            if (window.context_menu[self.el.id]['map'] != undefined) {
                self.buildContextMenu('map', e);
            }
        },1000);
        return false;
    });


    /**
     * Stop TIMER, and safe open or close context menu
     */
    google.maps.event.addListener(this.map, 'mouseup', function () {
        var context_menu_element = getElementById('gmaps_context_menu');

        if (jQuery(context_menu_element).hasClass('mouse_tap')){
            setTimeout(function () {
                context_menu_element.style.display = 'block';
            }, 0);

            jQuery(context_menu_element).removeClass('mouse_tap');
        } else {
            this.hideContextMenu;
        }

        clearTimeout(document.pressTimer);
        return false;
    });

    /**
     * if we move the map - cancel the opening of the context menu
     */
    var context_menu_with_mouse = ['drag', 'dragend', 'dragstart'];
    for (var ev = 0; ev < context_menu_with_mouse.length; ev++) {
        (function (object, name) {
            google.maps.event.addListener(object, name, function () {
                clearTimeout(document.pressTimer);
                jQuery(getElementById('gmaps_context_menu')).removeClass('mouse_tap').css('display', 'none');
                return false;
            });
        })(this.map, context_menu_with_mouse[ev] );
    }