javascript - google mapv3apiドラッグアンドクリックイベントの競合

Question

私は、ユーザーが地図をクリックするとすぐにマーカーが表示され、ユーザーがそのマーカーに関する自分の情報を挿入できるアプリケーションを開発しています。

たくさん検索しましget the css positions where user clicked on the mapたが、APIがその情報を返していません。

だから私は次のコードを試し、同様に機能しました。

$("#map").bind('click', function(event) {

        event.preventDefault();
        event.stopPropagation();
        $("#map .floatText").remove();

    var this = obj;
    var event = e;
    var myMap   =   this.map;

    var myMarker    =   this.marker;

    var posX = $(obj).position().left, posY = $(obj).position().top;

    var divAdd = "<div class='floatText'><input type='text' id='addText' name='addText'><button id='addTextButton'>Add</buton></div>";

    $("#map").append(divAdd);

    $("#map .floatText").css('position', 'absolute').css('left', (e.pageX - posX)).css('top', (e.pageY - posY)).css('z-index', "1000").css('background-color', "#fff").css('padding', "5px").css('width', "auto").css('border', '2px solid #00AC71');


    $("#addText").focus();

    $("#addTextButton").bind('click', function(event) {

        event.stopPropagation();

        var track = $(".markersUl li:last").attr('data-track');

         var chHtml = $("#addText").val();
         // add an infowindow
         var chInfoWindow = new google.maps.InfoWindow({
            content : chHtml
         });

         chInfoWindow.open(myMap, myMarker[track]);



        $("#map .floatText").remove();

    });

    $("#addText").bind('click', function(event) {

        event.stopPropagation();

    });

    });

これは次のようになります

ここで問題となるのは、マップをドラッグするとすぐに、マウスの左ボタンを離したときにクリックイベントが発生することです。

これに関する解決策はありますか？