リーフレットコントロールが既にマップに追加されているかどうかを調べる

Question

私はカスタムリーフレットコントロールを作成しました。それは、各レイヤーに追加することができる何らかの伝説です。コントロール自体には、マップからポップアップのようなものを削除する閉じるボタンがあります。 コントロールを追加するには、ボタンをクリックします。 私の問題は、ユーザーが同じコントロールをマップに何度か追加することができることです。だから、私はこの特定のコントロールが既にマップに追加されているかどうかをテストし、もしそうなら、それを再度追加しないでください。

は私が

control.addTo(map); 

今すぐコントロールが閉じるボタンを持っている想像してクリックし、いくつかのオプション

var control = L.control.customControl(mylayer); 

とボタンの私のマップに追加を渡し、それぞれの層のためのコントロールを作成して閉じることができます。今、ユーザーがもう一度ボタンをクリックした場合、私はそれが地図上まだない場合、コントロールを追加したい - このような何か（hasControlは擬似コードである、そのような機能は、私の知る限りではありません）簡単にするために

if(!(map.hasControl(control))) { 
    control.addTo(map); 
} 

私が作りましたズームコントロールを作成して2回追加する例here

Answer 1

最も簡単な方法は、あなたのコントロールインスタンス上_map財産の存在を確認することです：

var customControl = new L.Control.Custom(); 

console.log(customControl._map); // undefined 

map.addControl(customControl); 

console.log(customControl._map); // returns map instance 

しかし_mapプロパティを使用するときに、プロパティの_プレフィックスが、それはだということを意味することを、覚えておいてください。通常は使用しないプライベートプロパティです。今後のバージョンのリーフレットで変更または削除される可能性があります。あなたのL.Mapインスタンスにカスタムコントロールの参照を取り付け

：あなたがフォローのアプローチを使用している場合ということに遭遇するつもりはない

L.Control.Custom = L.Control.extend({ 
    options: { 
     position: 'bottomleft' 
    }, 
    onAdd: function (map) { 
     // Add reference to map 
     map.customControl = this; 
     return L.DomUtil.create('div', 'my-custom-control'); 
    }, 
    onRemove: function (map) { 
     // Remove reference from map 
     delete map.customControl; 
    } 
}); 

今、あなたはあなたのマップのインスタンスに参照をチェックすることができるようにそう：

if (map.customControl) { ... } 

またはメソッドを作成し、L.Mapに含める：

L.Map.include({ 
    hasCustomControl: function() { 
     return (this.customControl) ? true : false; 
    } 
}); 

このように動作します

：

var customControl = new L.Control.Custom(); 

map.addControl(customControl); 

map.hasCustomControl(); // returns true 

map.removeControl(customControl); 

map.hasCustomControl(); // returns false 

はここPlunker上の概念のデモです：http://plnkr.co/edit/nH8pZzkB1TzuTk1rnrF0?p=preview