javascript - Googleマップでマーカーのタッチイベントをバインドするにはどうすればよいですか?

Question

Google マップ API はタッチ イベントをサポートしていません

しかし今、私は地図とマーカーで何かをする必要があります。たとえば、地図を長押ししたり、マーカーをタップしたり、マーカーをドラッグしたりします。

やりたいことは iOS 用の Google マップ クライアントと同じです

Answer 1

shreedharと同じ方法でタッチイベントを実装しましたが、「mousedown」イベントを使用しました。ウェブビュー（PhoneGapなど）でGoogle Maps APIを使用している場合、モバイルデバイスでは「クリック」はトリガーされませんが、「マウスダウン」イベントはモバイルのタップまたはウェブのクリックによってトリガーされます。

window.infowindow = new google.maps.InfoWindow({
   content: 'content'
});

google.maps.event.addListener(marker, 'mousedown', function(){
   window.infowindow.open(marker.get('map'), marker);
});

また、ページで1つのinfowindow変数のみを定義し、それをすべてのマーカーで再利用するようにしてください。そのため、infowindowを「グローバル」変数window.infowindowとして定義しました。

Answer 2

このリンクでは、多くの例を取得できます。 https://google-developers.appspot.com/maps/documentation/javascript/examples/

最近、私は Google マップに取り組みました。以下は、マーカーをドラッグ アンド ドロップできるコードで、モバイル Web ブラウザーで完璧に動作します。

gmap : function(lat,lng){
            var stockholm = new google.maps.LatLng(lat, lng);
            var parliament = new google.maps.LatLng(lat, lng);
            var marker;
            var map;
            function initialize() {
                var mapOptions = {
                    zoom: 13,
                    disableDefaultUI: true,
                    mapTypeId: google.maps.MapTypeId.ROADMAP,
                    center: stockholm
                };
                map = new google.maps.Map(document.getElementById("gmapDiv"),mapOptions);
                marker = new google.maps.Marker({
                    map:map,
                    draggable:true,
                    animation: google.maps.Animation.DROP,
                    position: parliament
                });
               var infowindow = new google.maps.InfoWindow({
                   content: 'content'
               });
                google.maps.event.addListener(marker, 'click', function(){
                  infowindow.open(marker.get('map'), marker);
                  });
            }
            initialize();
        }