2

hereのように、編集可能な Polygon があります。

ユーザーがマップ上でドットを移動しているときにイベントを「キャッチ」したい (ポリゴンのサイズを変更する)。ポイントへのスナップを実装するには、この機能が必要です。

出来ますか?

編集

this.polygon = new google.maps.Polygon({
    map: map,
    strokeWeight: 2,
    editable: true,
    path: this._path
});

var dragging = false;
google.maps.event.addListener(this.polygon, 'mousedown', function (event) {
    if (event.vertex) {
        dragging = true;
    }
});
google.maps.event.addListener(this.polygon, 'mousemove', function (event) {
    if (dragging) {
        // dragging
    }
});
google.maps.event.addListener(this.polygon, 'mouseup', function (event) {
    dragging = false;
});

コードは機能しており、イベントがキャッチされています。ただし、現在ドラッグされているポイントにアクセスしてその位置を変更することはできません。

イベント内でlatLngmousemoveオブジェクトを変更することも試みましたが、効果はありませんでした

一時的な解決策

サイズ変更中はポリゴン ゴーストにアクセスできないため、スナップを実装する唯一の解決策は、ポリゴンのサイズが変更された後に行うことです。

this.polygon = new google.maps.Polygon({
    map: map,
    strokeWeight: 2,
    editable: true,
    path: this._path
});

var path = this.polygon.getPath();
google.maps.event.addListener(path, 'set_at', function (event) {
    // Here do the snapping, after the polygon has been resized
});

google.maps.event.addListener(path, 'insert_at', function (event) {
    // Here do the snapping, after the polygon has been resized
});
4

5 に答える 5

1

はい、可能ですが、簡単ではありません。

ポリゴン オブジェクトでイベントを組み合わせて使用​​する必要があります。

PolygonMouseEventオブジェクトには、 と の 3 つのプロパティedgeがありpathますvertex。イベントが発生した場合、vertexそのインデックスを取得します。それ以外の場合は未定義です。

したがって、次のことを試してみると、必要な機能を構築できる場合があります。

  • mousedownイベントを聞いてください。vertexが定義されている場合、 dragging = true.
  • mouseupイベントを聞いてください。設定dragging = false
  • mousemoveイベントを聞いてください。その場合dragging = true、マウスの位置を取得します。e.latLngロジックを実行してスナップします。

私はこれを試していませんが、少しいじくり回すと、この方法を使用して動作するはずです。

mousemoveうまくいかない場合は、 を使用してみてくださいmouseover

試してみてうまくいかない場合は、コードを投稿してください。

于 2013-01-27T19:14:12.700 に答える
0

Seain Malkinが提案した解決策とここで提案された解決策をまとめて、同様の問題を解決しました(両方に感謝します)。

mousemove to の「Google イベント リスナー」を登録する代わりにpolygon、マップに DOM イベント リスナーを登録しましたdiv(特に Firefox で動作するように、useCaptureパラメーターを に設定します)。true

map.getDiv().addEventListener('mousemove', function (e) {
    if (drawing) {
        var latLng = getLatLngByOffset( map, e.clientX, e.clientY );
        // dragging
    }
}, true);
于 2013-04-17T09:45:18.050 に答える