115

リーフレットをオープン ソース マップとして使用し始めました。http://leaflet.cloudmade.com/

次の jQuery コードは、マップのクリック時にマップ上にマーカーを作成できるようにします。

 map.on('click', onMapClick);
function onMapClick(e) {
        var marker = new L.Marker(e.latlng, {draggable:true});
        map.addLayer(marker);
        marker.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();
};

しかし、現在、(私のコードでは) 既存のマーカーを削除したり、マップ上で作成したすべてのマーカーを見つけてそれらを配列に入れたりする方法はありません。誰でもこれを行う方法を理解するのを手伝ってもらえますか? リーフレットのドキュメントはこちらから入手できます: http://leaflet.cloudmade.com/reference.html

4

11 に答える 11

167

「var マーカー」を関数の外に出す必要があります。その後、後でアクセスできます：

var marker;
function onMapClick(e) {
        marker = new L.Marker(e.latlng, {draggable:true});
        map.addLayer(marker);
        marker.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup();
};

じゃあ後で ：

map.removeLayer(marker)

ただし、var マーカーは latest によって毎回消去されるため、最新のマーカーしか保持できません。1 つの方法は、マーカーのグローバル配列を作成し、そのグローバル配列にマーカーを追加することです。

于 2012-04-05T14:52:48.957 に答える
58

マーカーを配列にプッシュすることもできます。コード例を参照してください。これは私にとってはうまくいきます：

/*create array:*/
var marker = new Array();

/*Some Coordinates (here simulating somehow json string)*/
var items = [{"lat":"51.000","lon":"13.000"},{"lat":"52.000","lon":"13.010"},{"lat":"52.000","lon":"13.020"}];

/*pushing items into array each by each and then add markers*/
function itemWrap() {
for(i=0;i<items.length;i++){
    var LamMarker = new L.marker([items[i].lat, items[i].lon]);
    marker.push(LamMarker);
    map.addLayer(marker[i]);
    }
}

/*Going through these marker-items again removing them*/
function markerDelAgain() {
for(i=0;i<marker.length;i++) {
    map.removeLayer(marker[i]);
    }  
}
于 2013-03-08T09:35:38.300 に答える
8

(1) レイヤー グループと配列を追加して、レイヤーとレイヤーへの参照をグローバル変数として保持します。

var search_group = new L.LayerGroup(); var clickArr = new Array();

(2) マップを追加

(3)グループレイヤーを地図に追加

map.addLayer(search_group);

(4) マップへの追加機能。クリックすると削除オプションが表示されるリンクを含むポップアップが表示されます。このリンクは、ID としてポイントの緯度経度を持ちます。この ID は、作成したマーカーの 1 つをクリックして削除する場合と比較されます。 

 map.on('click', function(e) {
        var clickPositionMarker = L.marker([e.latlng.lat,e.latlng.lng],{icon: idMarker});
        clickArr.push(clickPositionMarker);
        mapLat = e.latlng.lat;
        mapLon = e.latlng.lng;
        clickPositionMarker.addTo(search_group).bindPopup("<a name='removeClickM' id="+e.latlng.lat+"_"+e.latlng.lng+">Remove Me</a>")
                .openPopup();   

                /*   clickPositionMarker.on('click', function(e) {
                  markerDelAgain(); 
                }); */


});

(5) remove 関数は、マーカーの緯度経度を remove で発生した ID と比較します。

$(document).on("click","a[name='removeClickM']", function (e) {

      // Stop form from submitting normally
    e.preventDefault();

    for(i=0;i<clickArr.length;i++) {

    if(search_group.hasLayer(clickArr[i]))
    {
        if(clickArr[i]._latlng.lat+"_"+clickArr[i]._latlng.lng==$(this).attr('id'))
            {
                hideLayer(search_group,clickArr[i]);
                clickArr.splice(clickArr.indexOf(clickArr[i]), 1);
            }

    }

    }
于 2014-05-20T08:35:32.607 に答える
2

追加機能でマーカーへの敬意を保存すると、マーカーはそれ自体を削除できます。配列は必要ありません。

function addPump(){
   var pump = L.marker(cords,{icon: truckPump}).addTo(map).bindPopup($('<a href="#" class="speciallink">Remove ME</a>').click(function() {
            map.removeLayer(pump);
          })[0]);
        }
于 2013-07-07T18:16:13.280 に答える
1

もう試しましlayerGroupたか？

ドキュメントはこちらhttps://leafletjs.com/reference-1.2.0.html#layergroup

レイヤーを作成し、すべてのマーカーをこのレイヤーに追加するだけで、マーカーを簡単に見つけて破棄できます。

var markers = L.layerGroup()
const marker = L.marker([], {})
markers.addLayer(marker)
于 2018-06-08T09:49:31.503 に答える