8

Google マップ V3 ポリラインがあります。ポリライン全体でクリック イベントを検出できますが、クリック イベントでさらに高度なことはできますか?

私がやりたいことは、クリックされたポリラインのセクションを検出し、これをアラートに表示することです。

 routePath = new google.maps.Polyline({
     path: routeCoordinates,
     strokeColor: "#CC33FF",
     strokeWeight: 3
 });     
 routePath.setMap(map);
 google.maps.event.addListener(routePath, 'click', function() {
     alert(routePath);
     // TODO: display which section of the polyline has been clicked?
 });

Googleマップでこれを行う方法を知っている人はいますか?

ありがとう！

4

3 に答える 3

12

クリック イベントで、クリックされた座標の LatLng を受け取ることができます。ただし、これはおそらくポリラインを作成する正確なポイントではないため、最も近いポイントを見つける必要があります。Google マップ ライブラリの computeDistanceBetween を使用するか、ピタゴラスの定理を使用できます。この場合、十分な精度が得られるはずです。

computeDistanceBetween の詳細については、 https ://developers.google.com/maps/documentation/javascript/reference#spherical を ご覧ください。

これは、computeDistanceBetween を使用してそれを行う方法のコード例です。

google.maps.event.addListener(routePath, 'click', function(h) {
     var latlng=h.latLng;
     alert(routePath);
     var needle = {
         minDistance: 9999999999, //silly high
         index: -1,
         latlng: null
     };
     routePath.getPath().forEach(function(routePoint, index){
         var dist = google.maps.geometry.spherical.computeDistanceBetween(latlng, routePoint);
         if (dist < needle.minDistance){
            needle.minDistance = dist;
            needle.index = index;
            needle.latlng = routePoint;
         }
     });
     // The closest point in the polyline
     alert("Closest index: " + needle.index);

     // The clicked point on the polyline
     alert(latlng);

 });
于 2012-03-19T21:09:10.077 に答える
4

私は同じに遭遇しました、ここで問題は私がそれをどのように処理したかです:ハンドラーをセットアップするとき:

google.maps.event.addListener(routePath, 'click', function(e) {
    handlePolyClick(e, this)
});

var handlePolyClick(eventArgs, polyLine) {
    // now you can access the polyLine
    alert(polyLine.strokeColor);
});

または、関連するオブジェクトにアクセスする場合は、polyLine に変数を作成して設定します。

routePath.car = $.extend({}, cars[1]); // shallow copy of cars[1]

その後、イベントから車にアクセスできます:

alert(this.car.color);
于 2015-04-27T18:22:51.237 に答える
1

距離分析による最も近いポイントの検索は、多くの場合、パスがパス自体の上または近くで交差する場合に失敗します。

これを使用して候補を特定できますが、クリック ポイントを使用して 2 つの連続するポリライン ポイントを分割する場合は、作成された 2 つのラインの外積および/または内積を比較して確認する必要があります。

于 2014-02-12T18:35:15.757 に答える