同時に2つのGoogle Mapsマーカーをドラッグする

Question

オンラインでいくつかの記事を見つけました。複数のマーカーを選択する方法を説明するスタックオーバーフローの記事がいくつか見つかりましたが、2つのマーカーをドラッグするためのものは見つかりませんでした同時。私は、1つのマーカーがイベントを発生させ、関連するマーカーをドラッグするように動作させることができましたが、どういうわけか、クリックしたマーカーのドラッグイベントを停止します。

複雑なマーカーsvg上の1つのパスのみの色を変更することはできないため、複雑なポリゴンは使用できません。私は2つのsvgsを作成する必要があります.1つは中央の塗りつぶし、もう1つは外側の塗りつぶしです。そして、外側の塗りの色を変更する必要があります。

これはその動作です。

まず、マーカーを作成して、同じ場所に配置します。

これらのマーカーをこの関数に渡します。

addMultiMarkerListener:function(id, outer, inner){ 
    var arr = ['mousedown', 'mouseup', 'click','mouseover','mouseout', 'dragend','drag','dragstar']; 
    var evtArr = {} 
     _.each(arr, function(evt){ 
      evtArr[evt] = {}; 
      evtArr[evt][id] = false; 

      outer.addListener(evt, function(){ 
       if(!evtArr[evt][id]){ 
        evtArr[evt][id] = true; 
        google.maps.event.trigger(inner, evt); 
        evtArr[evt][id] = false 

       } 

      }) 

      inner.addListener(evt, function(){ 
       if(!evtArr[evt][id]){ 
        evtArr[evt][id] = true; 
        google.maps.event.trigger(outer, evt); 
        evtArr[evt][id] = false 
       } 
      }) 
     }) 

    }, 

私は、これは私がダウンしてクリックしたときに、私は同時にこれらのマーカーの両方をドラッグできるように、両方のマーカーのためのマウスダウンイベントをトリガーすることができるようにしたいです。それが今働く方法は、私がmousedownイベントを兄弟マーカーで発射すると、最初のマウスイベントを停止します。

私は、私が最初のものに干渉しない別の出来事を起こすこともできると考えていました。それは少し深い考えがかかるかもしれませんが、私はそれを機能させることができると思います。私はちょうど誰かがこれについていくつかの洞察を提供できるかもしれないことを望んでいた。

Answer 1

私はこの問題を解決しました。 2つのマウスイベントを発生させるのではなく、ドラッグイベントの最初のマーカーの位置を取得し、2番目のマーカーの位置を最初のマーカーの位置に設定することにしました。そのようです。

addDragListener: function(marker, id, centerMarker) { 
     var self = this; 
     var fill = centerMarker; 


     marker.addListener('drag', function(){ 
      var position = marker.getPosition(); 
      fill.setPosition(position); 

     }) 
    }