leaflet 覆蓋物與點位重合獲取點擊的元素

在使用 leaflet-canvas-marker 加載海量點位後，繼續加載polygon多邊形會產生一個問題，就是polygon繪出來的遮罩物的層級是比海量點位加載的層級高的（使用L.makrer 生成的點位沒有此問題）。當我們要點擊遮罩物覆蓋的點位時候就會點擊到遮罩物，如何解決了，這裏提供一個思路。

1.定義一個變量 clickType 

  let clickType = "";

2.在海量點位點擊的方法中設置clickType的值，這樣當點擊覆蓋物下的點位的時候就會設置clickType就發生改變

   ciLayer = L.canvasIconLayer({}).addTo(map);
      ciLayer.addOnClickListener(function(e, data) {
        clickType="marker"
        markerIconShow(data[0].data);
        setTimeout(()=>{
          clickType=""
        },200) 
      });

3.然後在polygon 的點擊事件裏面判斷clickType的值，記得要添加setTimeout 不然無法獲取到點擊後的clickType改變的值

  polygon.on("click", function(e) {
          setTimeout(()=>{
            if (clickType == "marker") {
              return false;
            }
            let marker = e.target,
            center = e.latlng;
          ajax({
            url: "/api/task/local_detail",
            data: { type: marker.type, id: marker.id }
          }).then(res => {
            let data = res.data
          });
      
          },200)
         
        });

至此，當點擊覆蓋物下的點位的時候就會點擊到點位，不會觸發polygon的點擊事件