基本レイヤのインタラクティブ性を妨げるリーフレットレイヤー

Question

私はLeaflet Choropleth Tutorialに基づいてプロジェクトを進めています。私のマップでは

、私はちょうどChoroplethテンプレート内などの情報をポップアップこれらの層のハイライトとディスプレイの

各

var basemaps= { 
"layer1": layer1, 
"layer2": layer 2, 
"layer3": layer 3 
}; 

の間、ユーザがスイッチ3つのベース層を有します。

また、どの領域がアクティブであるかによって、各領域のラベル（値）を表示するレイヤーがあります。

var activelabel = L.layerGroup(); 
var showlabels = { 
    "labels": activelabel 
}; 

map.on('baselayerchange', function (event) { 
    activelabel.clearLayers(); 

    switch (event.layer) { 
    case layer1: 
     label1.addTo(activelabel); 
     break; 
    case layer2: 
     label2.addTo(activelabel); 
     break; 
    case layer3: 
     label3.addTo(activelabel); 
     break; 
    } 
}); 

私の問題は、ユーザーがラベルがある領域の一部の上に置いた場合、ラベルは、アクティブな場合、ハイライト機能と情報ボックスが何も表示されないということです。

ホバーはまだ動作するように私は、activelabel層が見えないようにする方法を見つけようとしています。

私は私の問題への解決策のように思えるMap Panesのチュートリアルを見つけたが、何もしていないようです。

私は私が間違った場所にペイン情報を入れているかどうかわからないんだけど、または私はそれが必要だと思うように、これは実際に動作しない場合は？私はxIndexをどこからでも0から700に変更しようとしましたが、違いはありませんか？ここでの「ラベル」コード、私は私のラベル私はレイヤーグループを作成

var createLabelIcon = function(labelClass,labelText){ 
return L.divIcon({ 
className: labelClass, 
html: labelText 
}) 
}; 

だけでなく、ここを、フォーマット：

map.createPane('labels'); 
map.getPane('labels').style.zIndex = 700; 
map.getPane('labels').style.pointerevents = 'none'; 

私はペインを入れて試してみました。

var label1 = new L.layerGroup();       
makelabel1(); 

助けてください。ありがとうございました。

Answer 1

私はこれに対する解決策を見つけました。 3つの別々の.jsファイルがあり、ラベルを含むすべてのレイヤーをレイヤーグループに追加します。

各ファイルの.addLayerの各インスタンスに{interactive：false}を追加すると、ラベルがマウスのホバーを中断しないようにします。

私はインタラクティブを追加すると、なぜこれがうまくいかないのか分かりません：各addLayer行とは違ってレイヤーグループにfalseが動作しているようです。