2017-08-24 2 views
0

オリジナル-markerIcon =リーフレット/画像/マーカーアイコン2x.png 電流markerIcon =リーフレット/画像/マップ-marker.png変更マーカーアイコン

私は多くのマーカーを持っていると私はしたいです現在のクリックされたマーカーのマーカーアイコンを変更します。別のマーカーをもう一度クリックすると、すべてのマーカーアイコンを元のマーカーに、現在のマーカーを現在のアイコンに変更します。

また、各マーカーにはラベルが付けられています。 現在のアイコンをクリックすると、そのマーカーのラベルも変更するか、ラベルを削除したいと思います。

どうすればこの問題を解決できますか?

ありがとうございました。 enter image description here 元-markerIcon

EDIT-1

L.Icon.Change = L.Icon.Default.extend({ 
         options: { 
          iconUrl: 'leaflet/images/map-marker.png', 
          iconSize: new L.Point(150, 75), 
         } 
        }); 
        var changeIcon = new L.Icon.Change(); 

        L.Icon.Original = L.Icon.Default.extend({ 
         options: { 
          iconUrl: 'leaflet/images/marker-icon-2x.png', 
          iconSize: new L.Point(45, 81), 
         } 
        }); 
        var originalIcon = new L.Icon.Original(); 

        marker.on('click',function(e){ 
         for(var i = 0 ; i < $scope.markers.length ; i++){ 
          $scope.markers[i].setIcon(originalIcon); 
         } 


        }) 


        // marker click event to show the center pano 
        $scope.markers[index].on('click',function(e){ 
         $scope.markers[index].setIcon(changeIcon); 
        }); 

答えて

0

の可視マーカーと画像Iは、マップ内の "各層" という名前の関数があると勘違いしておりません場合。マーカを作成すると、リーフレットはそのIDの自動IDを与えます。だからあなたは "eachLayer"関数でそのIDを与えなければなりません。適切なマーカーが見つかると、関数 "popupclose"が存在するはずです。コードを表示すると、それを追加する方がいいでしょう...!

関連する問題