4

Google マップの描画パスの Google Earth のデスクトップ バージョンを模倣しようとしています。私がやったことは、パスを描画しようとしたときに、デフォルトのマップのドラッグ可能なイベントを無効にし、マウスダウン イベントを添付したことです。mousedown イベントの後、mousemove イベントがトリガーされ、それに応じて動作します。マウスがリリースされると、イベントが mouseup ハンドラーにトラップされ、mousemove ハンドラーが mouseup イベント リスナーで削除されます。ただし、これは 2 回目の mousedown および mouseup イベントの後で正しく機能しません。

私のコードは次のとおりです。

var map = 'Already created map object';
var polyOptions = {
                    strokeColor: '#000000',
                    strokeOpacity: 1.0,
                    strokeWeight: 2,
                    map: map,
                    idx: 0
                };
var mouseMoveHandler = null;
google.maps.event.addListener(map, 'mousedown', function(e) {
  mouseMoveHandler = google.maps.event.addListener(map, 'mousemove', function(e) {
  // Create a new polyline instance if it does not exists
  if ("undefined" == typeof(GMap._poly[GMap._active_overlay])) {
    GMap._poly[GMap._active_overlay] = new google.maps.Polyline(polyOptions);
  }
  var path = GMap._poly[GMap._active_overlay].getPath();
  path.push(e.latLng);
  }); // End of mousemove lister
  return false;
});

google.maps.event.addListener(map, 'mouseup', function(e) {
  google.maps.event.removeListener(mouseMoveHandler);
});
4

2 に答える 2

3

これを polyOptions に追加します。

clickable:false

そうしないと、ポリゴンはマウスイベントをリッスンし、マウスアップイベントはマップではなくポリゴンで発生します。

于 2013-07-08T08:48:33.580 に答える
0

ブートストラップのツールチップの例:

    google.maps.event.addListener(poly,"mousemove",function(e){

        var _tooltipPolys = $("#tooltipPolys");
        if(_tooltipPolys.length == 0) {
            _tooltipPolys = $(' \
                <div id="tooltipPolys" class="tooltip top" role="tooltip"> \
                    <div class="tooltip-arrow"></div> \
                    <div class="tooltip-inner"></div> \
                </div> \
            ');
            $("body").append(_tooltipPolys);
            $("div.tooltip-inner", _tooltipPolys).text(this.title);
            _tooltipPolys.css({
                "opacity": ".9",
                "position":"absolute"
            });
        }

        var pageX = event.pageX;
        var pageY = event.pageY;
        if (pageX === undefined) {
            pageX = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
            pageY = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;
        }
于 2015-07-05T11:18:04.750 に答える