リーフレット.contextmenuコールバック

Question

私はLeaflet.contextmenuライブラリの問題に苦しんでいます。

私は大域配列に保存された、いくつかの異なるマップを取得しました。次に、contextmenuオプションを使用して、私のマップにcontextmenuを持っています。私のコールバック関数を定義したいとき、arrMap[id]にアクセスすることができません。これは私が使用しているidを知らないためです。

私の質問はここにあります：オブジェクト（idなど）をLeaflet.contextmenuライブラリのコールバック関数に与えるにはどうすればよいですか？

//function x(){... 
callback: newMeasurement(e,id) 
//...} 

function newMeasurement(e,id){ 
    console.log(id); 
} 

...しかし、それは助けのため:(

おかげでみんなが働いていない

Answer 1

あなたは以上の閉鎖を作成する必要があります！私は何かについて考え

function x(){ 
    arrMap[id] = new L.map('map'+id,{ 
     contextmenu: true, 
     contextmenuWidth: 140, 
     contextmenuItems: [{ 
      text: 'Messung an dieser Position einfügen', 
      callback: newMeasurement 
     }, { 
      text: 'zeige Koordinaten', 
      callback: showCoordinates 
     }, { 
      text: 'Karte hier zentrieren', 
      callback: centerMap 
     }] 
    }); 
} 

function newMeasurement(e){ 
//do something with e AND ID 
} 

まず、«How do JS closures work?»の質問を読んでください。

次に、MDN reference for closuresをお読みください。そして、this question about how to create different Leaflet event handlers passing a different value to each handler function

---

は、それらの最初をお読みください。概念を理解してみてください。私は真剣です。あなたが盲目的にコードをコピー・ペーストすると、stackoverflowの神は子猫を殺します。

---

さて、あなたは一つのパラメータを受信するニーズ機能

function newMeasurement(ev){ 
    // do something with 'ev' AND 'id' 
} 

のように、ただ一つのパラメータを受け取りますイベントハンドラ関数を、持っていたい、とを持っているを必要としますidはどこかで可変です。 OK、その後、の関数を返す関数を作成してみましょう：あなたが実行した場合、

function getMeasurementHandler(id) { 
    return function(ev) { 
     doSomething(ev, id); 
    } 
} 

その方法を例：

var handlerForId1234 = function(ev) { doSomething(ev, 1234); } 

に多かれ少なかれ同等である

var handlerForId1234 = getMeasurementHandler(1234); 

すべてまとめてみましょう：

for (var id=0; id<4; id++) { 
    arrMap[id] = new L.map('map'+id, { 
     contextmenuItems: [{ 
      text: 'Somethingsomething', 
      callback: getEventHandlerForId(id) 
     }] 
    }); 
} 

getCallbackFuncForId(id) { 
    return function(ev) { 
     console.log('Event ', ev, ' in ID ', id); 
    } 
}