14

Google Maps APIを使用していますが、モバイルデバイスで地図をスクロールして通過できるようにし、スクロールホイールを使用してウェブページを下にスクロールするときに地図をズームしないようにしたいと考えていました。

これが私のコードです：

var mapOptions = {
  center: new google.maps.LatLng(51.605139, -2.918567),
  zoom: 15,
  scrollwheel: false,
  draggable: false,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};

これは問題ありませんが、マップがクリックされたときにのみスクロールホイールのズームを有効にすることを実現したいと思います。

（つまり、Webページでは、マップをクリックするとズームできます。モバイルデバイスでは、画面をタップすると、マップをつまんでズーム/ドラッグできます。）

ダブルクリックまたはシングルクリックでのみドラッグ可能をアクティブにするイベントリスナーを追加できますか？
APIを使用することは可能ですか？

編集

次のコードを試しましたが、機能しないようです。

google.maps.event.addListener(map, 'click', function (event) {
  var mapOptions = {
    draggable: true,

  };
});
4

7 に答える 7

27

これは機能するはずです：

        google.maps.event.addListener(map, 'click', function(event){
          this.setOptions({scrollwheel:true});
        });
于 2013-03-10T22:02:14.780 に答える
16 
google.maps.event.addListener(map, 'mouseout', function(event){
 this.setOptions({scrollwheel:false});  
});

これは、Dr.Molleの回答に加えて、便利な小さな考慮事項です。

表示どおり、マウスがマップから離れると、スクロールホイールのズームが再び無効になります。

于 2014-03-25T22:25:33.290 に答える
0

これは私の例であり、私にとってはうまくいきます。ページが読み込まれると、Google マップ (ホイール スクロール) がオフになり、マップをクリックすると (ホイール スクロール) がオンになります。

var map = new google.maps.Map(document.getElementById('map-id'), {
            scrollwheel: false,
        });
        google.maps.event.addListener(map, 'mouseout', function(){
            this.setOptions({scrollwheel:false});
        });
        map.addListener('click', function() {
            map.set('scrollwheel', true);
        });
于 2016-12-08T13:02:07.260 に答える