GeoJSON ポリゴンとポイントを取り込むマップがあります。
標準の Leaflet メソッドを使用してこれらを表し、それぞれ SVG と html マーカーを作成します。
アイデアを得るには：http: //i.imgur.com/GSJSZIc.jpg
SVG = 青、マーカー = 緑。
Leaflet は、SVG 用の「ペイン」、div.leaflet-overlay-pane、およびマーカー用の div.leaflet-marker-pane を作成します。リーフレット マーカー ペイン (赤で縁取られた) は、ビューポートの半分をカバーし、リーフレット オーバーレイ ペインよりも高い z-index を持っているため、その下の SVG ポリゴンはクリックできなくなります。
オーバーレイ ペインの zindex をマーカー ペインより小さく設定すると、オーバーレイ ペインがビュー ポート全体をカバーするため、すべてのマーカーをクリックできなくなります。
createPane() に関するリーフレット Github の問題でいくつかのことを読みましたが、これまでのところ動作していません。これは、この問題を解決するものである必要がありますか? つまり、すべてのマーカーと SVG ポリゴンを同じペイン/div に配置します。
とりあえず、マーカー ペインを 1px x 1px に設定しました。これは問題なく機能しているように見えますが、なぜマーカー ペインがビューポート サイズの半分に設定されるのでしょうか?